以下是全屏大图代码

1、以下是全屏大图代码（标红的地方根据直接的需要调整）<div class="J_TWidget" data-widget-config="'effect': 'fade', 'circular': true ,'contentCls':'piao1364550366737fu'" data-widget-type="Tabs"><div class="piao1364550366737fu" style="he

2、ight:1000px;"><div class="J_TWidget" data-widget-config="'contentCls': 'slide-kun1364550366737content', 'triggerCls': 'slide-kun1364550366737triggers', 'triggerType': 'mouse', 'effect': 'scrollx','prevBtnCl

3、s':'prev','nextBtnCls':'next', 'steps': 1, 'autoplay': true,'viewSize':1440, 'circular': true " data-widget-type="Carousel" style="padding-bottom:0px;padding-top:0px;padding-left:0px;left:-245px;margin:0px;z-index:10;top

4、:0px;padding-right:0px;width:1440px;"><a href="店铺链接" target="_blank"><img src=" style="float:none;margin:0px;" /></a></div></div></div>模块使用说明：size=13.63636302947998px此模块只有短短不到十行代码，并且未调用任何Widget组件，纯CSS实现，大家可能会奇怪，为什么没有调用Wid

5、get组件，也可以实现全屏？哈哈，因为调用了模板class，大家看代码中的 class="footer-more-trigger"，这个footer-more-trigger就是模板自带的class，那这个class包含哪些css呢？请看以下代码：1 .footer-more-trigger 2 position: absolute;3 padding: 6px 11px 4px 14px;9 q' C% o9 L& F4 F7 & X# t4 width: 37px;5 line-height: 1.3;! J- a! 6 1 Q9 E( R+ s

6、9 0 6 border: 1px solid #fff;! u* d7 X! M2 t; U7 left: -12px;( F9 ; |7 ?+ o. 5 , m8 top: -5px;8 9 S& h& f6 n. t& ) R; Z- 9 复制代码解释下其中的含义：! x7 Q* ) q0 N9 m; fposition:absolute，就是绝对定位，脱离文档流，说的通俗点，就是脱离淘宝的950界线，想要实现全屏，那我们就要用到这个属性。; n4 Y$ j& D3 J4 _- ?padding，内边距，我们不需要，所以要把它去掉，设置padding:0即

7、可; width，宽度，这个我们也不需要，不用理它就可以，设置为width:0px也可以;line-height，行高，全屏海报不需要这个，也不理它;border，边框，这个必须设置为border:none，也就是把边框设为无，要不左右上下将会各占1个象素;left，左偏移，模板设置的是 -12px，这个当然不是我们需要的数值;9 C, I" g I7 top，上偏移，模板设置的是 -5px，注意，这里我们必须设置为 top:auto，也就是自动，千万不要设置为 top:0px，不相信？你可以试下.# z$ k- S7 v& m3 m! E) i1 E9 k4 b* 7 U

8、x1 N事实上，我们只需要用到这个class里的position:absolute绝对定位属性，其它的是我们不需要的，可能会有朋友说了，那我们自己写一个绝对定位不就行了，干嘛非要调用这个class？呵呵，如果我们自定义能用这个属性，那我就不用搞的这么复杂了。" g' Q, G n) C" v8 D0 M# hsize=13.63636302947998px学过HTML、XHTML的，应该都知道CSS的加载顺序为：行内样式内部样式外部样式，其中行内样式优先级最高，所以我们在代码中加入 style="top:auto;border:none;padding:0

9、;" 将会被加载，而不会再去加载模板自带的css_% M/ 4 G9 v3 Y. Z1920px 全屏海报：size=13.63636302947998px（宽度1920px，高度随便自己调，同时修改两处500px即可）10 <div style="height:500px;">+ L5 n) R" c0 v) D4 _1 a6 S11 <div class="footer-more-trigger" style="left:50%;top:auto;border:none;padding:0;"

10、>12 <div class="footer-more-trigger" style="left:-960px;top:auto;border:none;padding:0;">13 <a href="#" target="_blank" style="width:1920px;height:500px;display:block;">14 <img src="#" border="0" alt="全屏海报&q

11、uot; /></a>& D& E. E1 S% O5 c1 M15 </div>' U" R% u9 n: O% e" C: 4 H16 </div>17 </div>复制代码1680px 全屏海报：size=13.63636302947998px（宽度1680px，高度随便自己调，同时修改两处500px即可）18 <div style="height:500px;">9 r, f) Y; K; h) H19 <div class="footer-

12、more-trigger" style="left:50%;top:auto;border:none;padding:0;"> S5 i. c/ J2 t. Q7 20 <div class="footer-more-trigger" style="left:-840px;top:auto;border:none;padding:0;">21 <a href="#" target="_blank" style="width:1680px;height:

13、500px;display:block;"> m! P/ A2 i2 Q( 22 <img src="#" border="0" alt="全屏海报" /></a>- J9 " x$ D* o23 </div>, 2 2 m( 5 w24 </div>" 3 z% o2 R4 S25 </div>复制代码1440px 全屏海报：size=13.63636302947998px（宽度1440px，高度随便自己调，同时修改两处500px即可）2

14、6 <div style="height:500px;">0 " ( P& " - n27 <div class="footer-more-trigger" style="left:50%;top:auto;border:none;padding:0;">28 <div class="footer-more-trigger" style="left:-720px;top:auto;border:none;padding:0;">%

15、c& r) z' o; N29 <a href="#" target="_blank" style="width:1440px;height:500px;display:block;">2 ; Z, M4 R* I' L, f, s30 <img src="#" border="0" alt="全屏海报" /></a>" J- C/ 7 F: F8 6 w- V/ C31 </div>32 &l

16、t;/div>33 </div>复制代码注意：以上代码仅适用于淘宝C店，天猫商城请用以下代码：. e Q' Q* . |2 m5 y1920px全屏海报：size=13.63636302947998px（宽度1920px，高度随便自己调，同时修改两处500px即可）34 <div style="height:500px;">8 |$ e& V9 P) k0 B5 E8 35 <div class="sn-simple-logo" style="padding:0px;left:50%;top:

17、auto;">: ( I$ c6 Y+ N0 _7 E# E3 k36 <div class="sn-simple-logo" style="padding:0px;left:-960px;top:auto;">37 <a href="#" style="width:1920px;height:500px;display:block;" target="_blank"> 38 <img alt="全屏海报" border=&quo

18、t;0" src="#" /></a>39 </div>9 d$ r9 q1 $ w3 _ r40 </div>41 </div>复制代码淘宝店铺全屏轮播装修带缩略图切换代码，使用方法新建一个自定义区，把需要替换的图片链接替换就可以发布了<div class="J_TWidget" data-widget-config="'effect': 'fade', 'circular': true ,'contentCls

19、9;:'taobaoux'" data-widget-type="Tabs" style="height:550px;overflow:hidden;"> <div class="taobaoux" style="height:550px;"> <div class="footer-more-trigger" style="width:1920px;height:550px;top:auto;padding:0px;border:non

20、e;left:50%;"> <div class="footer-more-trigger" style="width:1920px;height:550px;padding:0px;border:none;left:-960px;"> <div data-widget-config="'contentCls': 'taobaoux-com','navCls': 'bbs-taobaoux-com','effect': 's

21、crollx','easing': 'easeOutStrong','prevBtnCls':'prev1920','nextBtnCls':'next1920','autoplay': true,'viewSize':1920,'circular': true" data-widget-type="Carousel" class="J_TWidget"> <div class=&q

22、uot;J_TWidget" data-widget-config="'trigger':'.ux1920','align':'node':'.ux1920','offset':-500,0,'points':'cc','cc'" data-widget-type="Popup" style="display:none;"> <div class="prev19

23、20" style="font-size:100px;cursor:pointer;opacity:0.5;color:#f00;"><</div> </div> <div class="J_TWidget" data-widget-config="'trigger':'.ux1920','align':'node':'.ux1920','offset':500,0,'points'

24、:'cc','cc'" data-widget-type="Popup" style="display:none;"> <div class="next1920" style="font-size:100px;cursor:pointer;opacity:0.5;color:#f00;">></div> </div> <div style="height:550px;width:1920px;overflow:

25、hidden;padding:0px;margin:0px;" class="ux1920"> <ul class="taobaoux-com" style="height:550px;width:1920px;padding:0px;margin:0px;"> <li style="width:1920px;height:550px;padding:0px;margin:0px;"> <a target="_blank" href="此处

26、替换图片连接1" style="padding:0px;margin:0px;"> <img src="此处替换图片网址1" width="1920px" height="550px" border="0px"></a></li> <li style="width:1920px;height:550px;padding:0px;margin:0px;"> <a target="_blank&quo

27、t; href="此处替换图片连接2" style="padding:0px;margin:0px;"> <img src="此处替换大图片网址2" width="1920px" height="550px" border="0px"></a></li> <li style="width:1920px;height:550px;padding:0px;margin:0px;"> <a target

28、="_blank" href="此处替换图片连接3" style="padding:0px;margin:0px;"> <img src="此处替换大图片网址3" width="1920px" height="550px" border="0px"></a></li> <li style="width:1920px;height:550px;padding:0px;margin:0px;"

29、> <a target="_blank" href="此处替换图片连接4" style="padding:0px;margin:0px;"> <img src="此处替换大图片网址4" width="1920px" height="550px" border="0px"></a></li> <li style="width:1920px;height:550px;padding:0px;

30、margin:0px;"> <a target="_blank" href="此处替换图片连接5" style="padding:0px;margin:0px;"> <img src="此处替换大图片网址5" width="1920px" height="550px" border="0px"></a></li> </ul> </div> <div class=&

31、quot;footer-more-trigger" style="padding:0px;border:none;left:50%;"> <div class="footer-more-trigger" style="width:1920px;height:50px;padding:0px;border:none;left:-960px;background: url(此处替换小图片导航背景网址png) repeat;top:505px;"> <ul class="bbs-taobaoux-

32、com" style="width:950px;height:50px;margin:0 auto;text-align: center;"> <li style="display: inline;margin: 0 5px;cursor:pointer;line-height: 47px;"> <img src="此处替换小图片网址1" width="120px" height="39px" border="0px" style="vertical-align:middle;margin:5px 0;" /></li> <li style="display: inline;margin: 0 5px;cursor:pointer;line-height: 47px;"> <img src="此处替换小图片网址2" width="120px" height="39px" bor