韩都衣舍优惠券翻转代码 | 墨兮风电商博客 — 做专业的电商个人博客

收集分享
电商最优秀的资源


韩都衣舍优惠券翻转代码

以下代码需开通CSS权限才可以使用,<style></style>以内代码复制到店铺CSS框内点击保存。html代码复制到自定义内容区内即可。代码都经过测试使用,所以几乎不存在使用不了的情况。如果发生图片缺失或者不显示的情况可以自己替换一张同尺寸的图片进行浏览测试,图片不显示的情况可能是图片源地址遭到删除丢失【如代码预览没有效果请发布以后再浏览】

【主意本代码涉及淘宝widget,本地浏览需加以下代码】
如果需要在本地浏览代码效果在代码最开头加上如下代码:
<script src="http://a.tbcdn.cn/apps/pamirsshop/wiki/scripts/prettify.js" type="text/javascript"></script>
<script src="http://a.tbcdn.cn/s/kissy/1.1.6/kissy.js"></script>
<script src="http://a.tbcdn.cn/p/shop/1.0/mods/s/countdown/countdown-min.js"></script>
<script src="http://a.tbcdn.cn/apps/pamirsshop/wiki/scripts/jquery-min-1.4.js"></script>
<script src="http://a.tbcdn.cn/apps/pamirsshop/wiki/scripts/wiki.js"></script>
<script>
KISSY.ready(function(S){
S.Countdown.autoRender();
});
</script>

兮风QQ:2802813994。微信号:jiyaoshijue(或扫右边二维码)如有疑问欢迎加我谈论。

图片是样例,内容可以自行替换也可以达到效果。如果觉得本文好也可以发转发给身边的朋友分享。



大家如果想学习哪家店铺的代码可以在下面留言 我会在店铺装修专栏里不定时为大家分解讲解代码的使用。

* 代码版权归原创者所有,本文仅用作参考,本博客不承担任何责任。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
<style type="text/css">

.hd_yhq1105 {
    width: 1920px;
    height: 215px;
}
.hd_yhq1105 ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: block;
    width: 100%;
    margin: 0 auto;
    height: 100%;
}
.hd_yhq1105 ul li {
    background: url(http://gdp.alicdn.com/imgextra/i2/263817957/TB2w3.XgVXXXXaGXXXXXXXXXXXX-263817957.png) no-repeat center top;
    width: 223px;
    position: relative;
    height: 215px;
    float: left;
    display: block;
}
.hd_yhq1105 ul li a {
    width: 223px;
    position: relative;
    height: 215px;
    float: left;
    display: block;
}
.hd_yhq1105 ul li i {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 50%;
    margin-left: -111.5px;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}
.hd_yhq1105 ul li img {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    margin-left: -50%;
    -webkit-transition: all 0.1s cubic-bezier(1, 1, 1, 1) 0.2s;
    -moz-transition: all 0.1s cubic-bezier(1, 1, 1, 1) 0.2s;
    -o-transition: all 0.1s cubic-bezier(1, 1, 1, 1) 0.2s;
    transition: all 0.1s cubic-bezier(1, 1, 1, 1) 0.2s;
}
.hd_yhq1105 ul .hd_active {
    background: url(http://gdp.alicdn.com/imgextra/i1/263817957/TB2YpcXgVXXXXaNXXXXXXXXXXXX-263817957.gif) no-repeat center top;
}
.hd_yhq1105 ul .hd_active i {
    width: 0;
    margin-left: 0;
}
.hd_yhq1105 ul .hd_active img {
    width: 223px;
    margin-left: -111.5px;
}

</style>
<div class="hd_yhq1105 left465 up10" style="z-index:30;">
  <div class="J_TWidget" data-widget-config="{'nextBtnCls':'hd_next','circular':true,'duration':0,'activeTriggerCls':'hd_active','effect':'none','interval':1,'navCls':'hd_nav','contentCls':'hd_contant','prevBtnCls':'hd_prev','autoplay':true}" data-widget-type="Carousel" style="width:1115px;margin:0 auto;height:100%;" data-widget-init="1">
    <ul class="hd_nav">
      <li class="ks-switchable-trigger-internal1870"> <a href=" " target="_blank"  ><i><img src="http://gdp.alicdn.com/imgextra/i2/263817957/TB22wcggVXXXXXoXXXXXXXXXXXX-263817957.png" alt=""></i></a> </li>
      <li class="ks-switchable-trigger-internal1870"> <a href=" " target="_blank"  ><i><img src="http://gdp.alicdn.com/imgextra/i1/263817957/TB2D1pnhXXXXXavXXXXXXXXXXXX-263817957.png" alt=""></i></a> </li>
      <li class="ks-switchable-trigger-internal1870"> <a href="" target="_blank" ><i><img src="http://gdp.alicdn.com/imgextra/i4/263817957/TB2E5thhXXXXXblXXXXXXXXXXXX-263817957.png" alt=""></i></a> </li>
      <li class="ks-switchable-trigger-internal1870"> <a href="" target="_blank" ><i><img src="http://gdp.alicdn.com/imgextra/i3/263817957/TB2gphghXXXXXbPXXXXXXXXXXXX-263817957.png" alt=""></i></a> </li>
      <li class="ks-switchable-trigger-internal1870 hd_active"> <a href="" target="_blank" ><i><img src="http://gdp.alicdn.com/imgextra/i4/263817957/TB2wtXdhXXXXXcIXXXXXXXXXXXX-263817957.png" alt=""></i></a> </li>
    </ul>
    <ul class="hd_contant" style="display:none;">
      <li   style="display: none;"> . </li>
      <li  style="display: none;"> . </li>
      <li   style="display: none;"> . </li>
      <li   style="display: none;"> . </li>
      <li   style="display: block;"> . </li>
    </ul>
  </div>
</div>

本章转自互联网,如有冒犯请联系版主修正 兮风电商博客 » 韩都衣舍优惠券翻转代码




喜欢 16

发表评论

电子邮件地址不会被公开。 必填项已用*标注

最新文章

  • 去评论
  • 去顶部