天猫装修实用代码，全屏代码，全屏轮播，倒计时，京东装修
淘宝Widget规范
导航CSS代码在线生成工具
轮播推荐模块在线生成工具
放大镜模块在线生成工具
带缩略图轮播模块在线生成工具
分隔模块在线生成工具
客服中心模块在线生成工具
搜索模块在线生成工具
天猫店铺1920全屏代码
<div style="height:3000px;width:1920px;" data-title="天猫店铺1920全屏代码">
<div class="sn-simple-logo" style="padding:0px;left:50%;top:auto;">
<div class="sn-simple-logo" style="padding:0px;left:-960px;top:auto;">
在此插入代码
</div>
</div>
</div>
淘宝店铺1920全屏代码
<div style="height:3000px;" data-title="淘宝店铺1920全屏代码">
<div class="footer-more-trigger" style="left:50%;top:auto;border:none;padding:0;">
<div class="footer-more-trigger" style="left:-960px;top:auto;border:none;padding:0;">
在此插入代码
</div>
</div>
</div>
走马灯
<marquee style="width:100%;height:100%;" data-title="走马灯" scrollamount="2" scrolldelay="1" direction="left" behavior="alternate">
<img src="//gdp.alicdn.com/imgextra/i4/1807289316/TB2l1eicpXXXXXeXXXXXXXXXXXX_!!1807289316.jpg" width="1920" height="42" border="0" usemap="#Map">
</marquee>
悬停切换图片效果
<div class="sub all_t10" data-title="悬停切换图片效果" style="width:300px;height:300px; dashed #ccc;background:url(http://img03.taobaocdn.com/imgextra/i3/743545528/T2gttoXBpaXXXXXXXX_!!743545528.jpg_310x310.jpg);float:left;margin-right: 20px">
<div data-widget-config="{\'trigger\':\'.all_t10\',\'align\':{\'node\':\'.all_t10\',\'offset\':[0,-300],\'points\':[\'bc\',\'tc\']}}" data-widget-type="Popup" class="J_TWidget hidden">
<div style="width:298px;height:298px;background:url(http://img03.taobaocdn.com/imgextra/i3/743545528/T2QW8dXzlaXXXXXXXX_!!743545528.jpg_310x310.jpg)">
<a href="#" style="display:block;width:298px;height:298px;" target="_blank"></a>
</div>
</div>
</div>
“sub all_t10”这个序列号需要修改一下，全部修改，一个图片切换一个对应的数字。否则切换的图片会混掉。
{\'node\':\'.all_t10\',\'offset\':[0,-300],\'points\':[\'bc\',\'tc\']}}"这段里面的【0，-300】的300一定要修改。修改成你要切换图片高度。
淘宝C店全屏轮播
<div class="J_TWidget" data-title="淘宝C店全屏轮播" data-widget-config="{\'effect\': \'fade\', \'circular\': true ,\'contentCls\':\'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:none;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\': \'scrollx\',\'easing\': \'easeOutStrong\',\'prevBtnCls\':\'prev1920\',\'nextBtnCls\':\'next1920\',\'autoplay\': true,\'viewSize\':[1920],\'circular\': true}" data-widget-type="Carousel" class="J_TWidget">
<div class="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="prev1920" 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\':[\'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: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="http://tbux.taobao.com/" style="padding:0px;margin:0px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920.jpg" width="1920px" height="550px" border="0px">
</a>
</li>
<li style="width:1920px;height:550px;padding:0px;margin:0px;">
<a target="_blank" href="http://tbux.taobao.com/" style="padding:0px;margin:0px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920_2.jpg" width="1920px" height="550px" border="0px">
</a>
</li>
<li style="width:1920px;height:550px;padding:0px;margin:0px;">
<a target="_blank" href="http://tbux.taobao.com/" style="padding:0px;margin:0px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920_3.jpg" width="1920px" height="550px" border="0px">
</a>
</li>
<li style="width:1920px;height:550px;padding:0px;margin:0px;">
<a target="_blank" href="http://tbux.taobao.com/" style="padding:0px;margin:0px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920_2.jpg" width="1920px" height="550px" border="0px">
</a>
</li>
<li style="width:1920px;height:550px;padding:0px;margin:0px;">
<a target="_blank" href="http://tbux.taobao.com/" style="padding:0px;margin:0px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920_3.jpg" width="1920px" height="550px" border="0px">
</a>
</li>
</ul>
</div>
<div class="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(http://demo.taobaoux.com/Carousel/Carousel_bg.png) repeat;top:505px;">
<ul class="bbs-taobaoux-com" style="width:950px;height:50px;margin:0 auto;text-align: center;">
<li style="display: inline;margin: 0 5px;cursor:pointer;line-height: 50px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920.jpg" 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: 50px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920_2.jpg" 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: 50px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920_3.jpg" 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: 50px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920_2.jpg" 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: 50px;">
<img src="http://demo.taobaoux.com/Carousel/1920/1920_3.jpg" width="120px" height="39px" border="0px" style="vertical-align:middle;margin:5px 0;" />
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<ul class="ks-switchable-nav" style="display:none;"></ul>
</div>
倒计时原始代码
<div class="J_TWidget" data-title="倒计时原始代码" data-widget-type="Countdown" data-widget-config="{\'endTime\': \'20000\',\'interval\': 1000, \'timeRunCls\': \'.ks-countdown-run\', \'timeUnitCls\':{\'d\': \'.ks-d\',\'h\': \'.ks-h\',\'m\': \'.ks-m\',\'s\': \'.ks-s\',\'i\': \'.ks-i\'},\'minDigit\': 1,\'timeEndCls\': \'.ks-countdown-end\'}">
<!-- 倒计时结束时隐藏-->
<!--可以写多个 -->
<div class="ks-countdown-run">
<span class="ks-d"></span>天
<span class="ks-h"></span>小时
<span class="ks-m"></span>分
<!-- 如果有0.1秒级别的变化建议以gif背景图片的形式变化 -->
<span class="ks-s"></span>秒
<span class="ks-i"></span>毫秒
</div>
<div class="ks-countdown-run"></div>
<!-- 倒计时结束时显示-->
<!--可以写多个 -->
<div class="ks-countdown-end">
倒计时结束了,干点什么吧把什么隐藏起来，或者把什么显示出来
</div>
<div class="ks-countdown-end"></div>
</div>
京东代码
京东品牌街全屏代码
<style>
.user_k_bj{width:990px; margin:0px auto}
.user_k_qp{width:1920px; margin-left:-582px; position:absolute}
.userdefined{ overflow:hidden; position:relative; width:auto}
</style>
<div class="user_k_bj" style="height:6328px">
<div class="user_k_qp" style="height:6328px"> 切面代码粘贴到这里 height 对应文件的高度像素 </div>
</div>
<div class="user_k_bj" style="width:990px; margin:0px auto;height:328px;">
<div class="user_k_qp" style="width:1920px; margin-left:-582px; position:absolute;height:328px"> 切面代码粘贴到这里 height 对应文件的高度像素 </div>
</div>
<div style="width:990px; margin:0px auto;height:700px;">
<div style="width:1900px; margin-left:-750px; position:absolute;height:700px;"> 切面代码粘贴到这里 height 对应文件的高度像素 </div>
</div>
京东搜索代码
<div class="m-search for-black-bg">
<form action="false" class="m-form" _lpchecked="1">
<input type="text" class="m-kw" value="" maxlength="5" size="5">
<input type="button" onclick="shop_signs_search(this)" value="搜索" class="m-submit">
</form>
</div>
京东绝对定位代码
<div class="thickframe" style="left:auto; top:auto; bottom:1%; right:auto; width:148px; height:160px; opacity:100; background:none"> </div>