淘宝宝贝展示-CSS3动态边框代码
淘宝宝贝展示模板代码 边框动态展示模块 --CSS动态边框：鼠标经过显示黑色边框，鼠标移开边框消失。效果如下图所示<div style="height:780px;">
<div class="J_TWidget" data-widget-type="Carousel" data-title="网店装修网" data-widget-config="{'duration':0.1,'activeTriggerCls':'\u00A0tshop-pbsm-shop-nav-ch','interval':0.1,'effect':'scrollx','activeIndex':1,'navCls':'nav_zw','contentCls':'content_zw','autoplay':true}" style="position:relative;">
<ul class="content_zw" style="display: none; width: 999999px; left: 0px; position: absolute;">
<li class="-_-switchable-panel-internal283 -_-switchable-panel-internal206 ks-switchable-panel-internal1739" style="display: block; float: left;"> </li>
</ul>
<ul class="nav_zw">
<li style="width:950px;height:500px;" class="ks-switchable-trigger-internal1738 tshop-pbsm-shop-nav-ch">
<div class="new-issue-list310-index clearfix">
<div class="con">
<TABLE border=0 cellSpacing=0 cellPadding=0 width=950 height=771>
<TBODY>
<TR>
<TD><A href="#"
target=_blank><IMG alt=""
src="http://img.tbzxiu.com/05/TB2RnvWaXXXXXXLXXXXXXXXXXXX_!!688196721.jpg" width=317
height=387>
<DIV style="WIDTH: 300px; HEIGHT: 370px"
class=footer-more-trigger></DIV>
</A></TD>
<TD><A href="#"
target=_blank><IMG alt=""
src="http://img.tbzxiu.com/05/TB2C.zVaXXXXXalXXXXXXXXXXXX_!!688196721.jpg" width=313
height=387>
<DIV style="WIDTH: 300px; HEIGHT: 370px"
class=footer-more-trigger></DIV>
</A></TD>
<TD><A href="#"
target=_blank><IMG alt=""
src="http://img.tbzxiu.com/05/TB2DK_VaXXXXXa7XXXXXXXXXXXX_!!688196721.jpg" width=320
height=387>
<DIV style="WIDTH: 300px; HEIGHT: 370px"
class=footer-more-trigger></DIV>
</A></TD>
</TR>
<TR>
<TD><A href="#"
target=_blank><IMG alt=""
src="http://img.tbzxiu.com/05/TB2o4LVaXXXXXaWXXXXXXXXXXXX_!!688196721.jpg" width=317
height=384>
<DIV style="WIDTH: 300px; HEIGHT: 370px"
class=footer-more-trigger></DIV>
</A></TD>
<TD><A href="#"
target=_blank><IMG alt=""
src="http://img.tbzxiu.com/05/TB2SkPTaXXXXXacXXXXXXXXXXXX_!!688196721.jpg" width=313
height=384>
<DIV style="WIDTH: 300px; HEIGHT: 370px"
class=footer-more-trigger></DIV>
</A></TD>
<TD><A href="#"
target=_blank><IMG alt=""
src="http://img.tbzxiu.com/05/TB2QIPWaXXXXXXMXpXXXXXXXXXX_!!688196721.jpg" width=320
height=384>
<DIV style="WIDTH: 300px; HEIGHT: 370px"
class=footer-more-trigger></DIV>
</A></TD>
</TR>
</TBODY>
</TABLE>
</DIV>
</DIV>
</LI>
</UL>
</DIV>
</DIV>
导航CSS代码：.new-issue-list310-index{width:950px;position:relative;padding:0px;}.new-issue-list310-index .con a{display:block;position:relative;padding:0px;}.new-issue-list310-index .con a img{display:block;padding:0px;}.new-issue-list310-index .con a div{border:0px solid #000;visibility:hidden;left:0;top:0;right:0;bottom:0;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;opacity:0;padding:0px;}.new-issue-list310-index .con a:hover div{border:7px solid #000;visibility:visible;opacity:1;padding:0px;}
页:
[1]