想在你淘宝网店设定淘宝网店悬浮球编码,让你店面两边都发生悬浮窗口就要使用淘宝双飘浮编码了。为淘宝旺铺旗舰型CSS DIV编码方式。
如今许多商家应用的都是双飘浮。最令人贴近与团购价击杀 亦似亦确实控制模块。坚信大伙儿早已看过了。许多人为因素这一花了N多的是钱,去精心策划控制模块, 也有一部分这样的人,自己的风格不想改变 的前提下能有这一团购价击杀控制模块和左飘浮控制模块 :如今我为大家完全免费的呈现控制模块的编码,出来我为大家截屏及其编码的一些详细说明。期待对诸位室内装修 及其装饰作用的上,能有一定的主要表现。 原本才华不太好,下面不多说了。这些就是做为参照,实际作用必须改善和自己的风格,装饰。
这个就是左边飘浮控制模块的编码: 右边的飘浮编码相近。
<DIV class="box J_TBox">
<DIV class="shop-custom no-border ">
<DIV class=bd>
<DIV class=custom-area>
<DIV></DIV>
<DIV class=bd>
<DIV class=custom-area>
<DIV class="float_ad J_TBox" style="LEFT: 5px; MARGIN: 0px; TOP: 100px">
<DIV class="J_TWidget float_bd" style="VISIBILITY: visible" data-widget-config="{'effect': 'none','autoplay': false,'circular': true,'triggerType':'click'}" data-widget-type="Tabs">
<ul class=ks-switchable-nav>
<li class="float_open ks-active" style="BACKGROUND-COLOR: #000"><font style="COLOR: #ffffff; BACKGROUND-COLOR: #000"><span style="MARGIN-BOTTOM: 5px"> </span> 点此进行归类 </font>
<li class=float_close style="BACKGROUND-COLOR: #000"><font style="COLOR: #ffffff; BACKGROUND-COLOR: #000">点此变小归类 <span>x</span> </font></li></ul><DIV class="ks-switchable-content ">
<DIV style="DISPLAY: block"><A href="http://www.taobao.com/" target=_blank><img alt="" src="https://img-1.tkgame.com/taozhijia/2022/07/12/https://www.taozhijia.com/wp-content/uploads/2022/09/1663653510-20220920055830-632956869da29.jpg"> </A>
<ul>
<li><A class=float_cats_0 href="http://wgshang.taobao.com/?search=y" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'所有归类'},{'type':'href','desc':'所有种类的联接详细地址'}]">所有归类</A>
<li><A class=float_cats_1 href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'主归类1'},{'type':'href','desc':'键入主归类1的联接详细地址'}]">钻石戒指</A>
<li><A class=float_cats_2 href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'主归类2'},{'type':'href','desc':'键入主归类2的联接详细地址'}]">耳环耳坠</A>
<li><A class=float_cats_3 href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'主归类3'},{'type':'href','desc':'键入主归类3的联接详细地址'}]">手串</A>
<li><A class=float_cats_4 href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'主归类4'},{'type':'href','desc':'键入主归类4的联接详细地址'}]">颈链</A>
<DIV class="J_TWidget hidden" data-widget-config="{
'trigger':'.float_cats_0',
'align':{
'node':'.float_cats_0',
'offset':[0,0],
'points':['tr','tl']
}
}" data-widget-type="Popup">
<DIV class=float_cats_bd>
<ul>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'所有归类-销售量'},{'type':'href','desc':'按销售量排序的联接详细地址'}]">按销售量</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'所有归类-新产品'},{'type':'href','desc':'按新产品排序的联接详细地址'}]">按新产品</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'所有归类-价钱'},{'type':'href','desc':'按价钱排序的联接详细地址'}]">按价钱</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'所有归类-个人收藏'},{'type':'href','desc':'按销售量排序的联接详细地址'}]">按个人收藏</A></li></ul></DIV></DIV>
<DIV class="J_TWidget hidden" data-widget-config="{
'trigger':'.float_cats_1',
'align':{
'node':'.float_cats_1',
'offset':[0,0],
'points':['tr','tl']
}
}" data-widget-type="Popup">
<DIV class=float_cats_bd>
<ul>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类1-1名字'},{'type':'href','desc':'小归类1-1联接详细地址'}]">女式钻石戒指</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类1-2名字'},{'type':'href','desc':'小归类1-2联接详细地址'}]">男款钻戒</A>
<li><A>小归类1-3</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类1-4名字'},{'type':'href','desc':'小归类1-4联接详细地址'}]">小归类1-4</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类1-5名字'},{'type':'href','desc':'小归类1-5联接详细地址'}]">小归类1-5</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类1-6名字'},{'type':'href','desc':'小归类1-6联接详细地址'}]">小归类1-6</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类1-7名字'},{'type':'href','desc':'小归类1-7联接详细地址'}]">小归类1-7</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类1-8名字'},{'type':'href','desc':'小归类1-8联接详细地址'}]">小归类1-8</A></li></ul></DIV></DIV>
<DIV class="J_TWidget hidden" data-widget-config="{
'trigger':'.float_cats_2',
'align':{
'node':'.float_cats_2',
'offset':[0,0],
'points':['tr','tl']
}
}" data-widget-type="Popup">
<DIV class=float_cats_bd>
<ul>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类1-1名字'},{'type':'href','desc':'小归类2-1联接详细地址'}]">小归类2-1</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类2-2名字'},{'type':'href','desc':'小归类2-2联接详细地址'}]">小归类2-2</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类2-3名字'},{'type':'href','desc':'小归类2-3联接详细地址'}]">小归类2-3</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类2-4名字'},{'type':'href','desc':'小归类2-4联接详细地址'}]">小归类2-4</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类2-5名字'},{'type':'href','desc':'小归类2-5联接详细地址'}]">小归类2-5</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类2-6名字'},{'type':'href','desc':'小归类2-6联接详细地址'}]">小归类2-6</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类2-7名字'},{'type':'href','desc':'小归类2-7联接详细地址'}]">小归类2-7</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类2-8名字'},{'type':'href','desc':'小归类2-8联接详细地址'}]">小归类2-8</A></li></ul></DIV></DIV>
<DIV class="J_TWidget hidden" data-widget-config="{
'trigger':'.float_cats_3',
'align':{
'node':'.float_cats_3',
'offset':[0,0],
'points':['tr','tl']
}
}" data-widget-type="Popup">
<DIV class=float_cats_bd>
<ul>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类3-1名字'},{'type':'href','desc':'小归类3-1联接详细地址'}]">小归类3-1</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类3-2名字'},{'type':'href','desc':'小归类3-2联接详细地址'}]">小归类3-2</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类3-3名字'},{'type':'href','desc':'小归类3-3联接详细地址'}]">小归类3-3</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类3-4名字'},{'type':'href','desc':'小归类3-4联接详细地址'}]">小归类3-4</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类3-5名字'},{'type':'href','desc':'小归类3-5联接详细地址'}]">小归类3-5</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类3-6名字'},{'type':'href','desc':'小归类3-6联接详细地址'}]">小归类3-6</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类3-7名字'},{'type':'href','desc':'小归类3-7联接详细地址'}]">小归类3-7</A>
<li><A href="http://wgshang.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类3-8名字'},{'type':'href','desc':'小归类3-8联接详细地址'}]">小归类3-8</A></li></ul></DIV></DIV>
<DIV class="J_TWidget hidden" data-widget-config="{
'trigger':'.float_cats_4',
'align':{
'node':'.float_cats_4',
'offset':[0,0],
'points':['tr','tl']
}
}" data-widget-type="Popup">
<DIV class=float_cats_bd>
<ul>
<li><A href="http://www.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类4-1名字'},{'type':'href','desc':'小归类4-1联接详细地址'}]">小归类4-1</A>
<li><A href="http://www.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类4-2名字'},{'type':'href','desc':'小归类4-2联接详细地址'}]">小归类4-2</A>
<li><A href="http://www.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类4-3名字'},{'type':'href','desc':'小归类4-3联接详细地址'}]">小归类4-3</A>
<li><A href="http://www.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类4-4名字'},{'type':'href','desc':'小归类4-4联接详细地址'}]">小归类4-4</A>
<li><A href="http://www.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类4-5名字'},{'type':'href','desc':'小归类4-5联接详细地址'}]">小归类4-5</A>
<li><A href="http://www.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类4-6名字'},{'type':'href','desc':'小归类4-6联接详细地址'}]">小归类4-6</A>
<li><A href="http://www.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类4-7名字'},{'type':'href','desc':'小归类4-7联接详细地址'}]">小归类4-7</A>
<li><A href="http://www.taobao.com/" target=_blank data-attr-replace="[{'type':'innerHTML','desc':'小归类4-8名字'},{'type':'href','desc':'小归类4-8联接详细地址'}]">小归类4-8</A></li></ul></DIV></DIV></li></ul><A href="http://www.taobao.com/" target=_blank><img alt="" src="https://img-1.tkgame.com/taozhijia/2022/07/12/https://www.taozhijia.com/wp-content/uploads/2022/09/1663653510-20220920055830-63295686abc60.jpg"></A><A href="http://www.taobao.com/" target=_blank><img alt="" src="https://img-1.tkgame.com/taozhijia/2022/07/12/https://www.taozhijia.com/wp-content/uploads/2022/09/1663653510-20220920055830-63295686b9f6d.jpg"></A><A href="http://www.taobao.com/" target=_blank><img alt="" src="https://img-1.tkgame.com/taozhijia/2022/07/12/https://www.taozhijia.com/wp-content/uploads/2022/09/1663653510-20220920055830-63295686c5019.jpg"></A>
<DIV><A href="http://wgshang.taobao.com/">
<DIV style="BACKGROUND-IMAGE: url(https://img-1.tkgame.com/taozhijia/2022/07/12/https://www.taozhijia.com/wp-content/uploads/2022/09/1663653510-20220920055830-63295686d017f.jpg); WIDTH: 128px; HEIGHT: 25px"></DIV></A></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV>
-----------------------------------------------------------------------
/*CSS导进彻底自定*/
.tb-shop .float_ww{
font-size:12px;
z-index:298;
min-height:300px;
margin-left:950px;
width:128px;
position:fixed;
_position:absolute;
height:300px;
}
.tb-shop .float_ww .float_hd{
border-bottom:#757575 1px dashed;
}
.tb-shop .float_ww .float_bd{
z-index:1;
right:0px!important;
width:128px;
position:absolute;
text-align:center;
}
.tb-shop .float_ww bar{
margin-top:0px!important;
}
.tb-shop .float_ww bar barbd{
z-index:999!important;
}
.tb-shop .float_ww bar baracts{
z-index:9999!important;
}
.tb-shop .float_ww .float_bd .ec_hd{
width:128px;
height:auto;
}
.tb-shop .float_ww .float_bd .ks-switchable-content ul{
padding-right:0px;
padding-left:16px;
padding-bottom:10px;
padding-top:0px;
}
.tb-shop .float_ww .float_bd h3{
clear:both;
padding-right:0px;
padding-left:0px;
padding-bottom:5px;
padding-top:5px;
text-align:center;
}
.tb-shop .float_ww .float_bd .ks-switchable-content li{
float:left;
margin-bottom:5px;
margin-right:10px;
}
.tb-shop .float_ww .float_bd{
color:#000;
}
.tb-shop .float_ww .float_bd a{
color:#000;
}
.tb-shop .float_ww .float_bd a:hover{
color:#C90;
}
.tb-shop .float_ww .add_fav{
min-height:24px;
width:128px;
height:24px;
}
.tb-shop .float_ad{
font-size:12px;
z-index:298;
min-height:300px;
margin-left:-128px;
width:128px;
position:fixed;
_position:absolute;
height:300px;
}
.tb-shop .float_ad .float_bd{
z-index:1;
left:0px!important;
width:128px;
position:absolute;
text-align:center;
}
.tb-shop .float_ad bar{
margin-top:0px!important;
}
.tb-shop .float_ad bar barbd{
z-index:999!important;
}
.tb-shop .float_ad bar baracts{
z-index:9999!important;
}
.tb-shop .float_ad a{
display:block;
}
.tb-shop .float_ad ul{
overflow:hidden;
width:128px;
border-bottom:#EF029A 2px solid;
}
.tb-shop .float_ad ul li{
line-height:26px;
height:26px;
}
.tb-shop .float_ad ul li a{
background:url(https://img-1.tkgame.com/taozhijia/2022/07/12/https://www.taozhijia.com/wp-content/uploads/2022/09/1663653510-20220920055830-63295686dbbe9.png) no-repeat right top;
overflow:hidden;
width:128px;
line-height:26px;
height:26px;
}
.tb-shop .float_ad ul li a:hover{
background:url(https://img-1.tkgame.com/taozhijia/2022/07/12/https://www.taozhijia.com/wp-content/uploads/2022/09/1663653510-20220920055830-63295686dbbe9.png) no-repeat right bottom;
color:#FFF;
line-height:26px;
height:26px;
}
.tb-shop .float_cats_bd{
background:#F0EFEF;
text-align:left;
min-width:120px;
}
.tb-shop .float_cats_bd ul{
border-top:#EF029A 1px solid;
}
.tb-shop .float_cats_bd ul li a{
padding-right:0px;
display:block;
padding-left:5px;
background:#F0EFEF;
padding-bottom:0px;
color:#575757;
line-height:26px;
padding-top:0px;
height:26px;
min-width:120px;
}
.tb-shop .float_cats_bd ul li a:hover{
background:#EF029A;
color:#FFF;
}
.tb-shop .float_bd .ks-switchable-nav{
border-top-style:none;
border-right-style:none;
border-left-style:none;
border-bottom-style:none;
}
.tb-shop .float_bd .ks-switchable-nav li{
clear:both!important;
padding-right:0px!important;
padding-left:0px!important;
background:#BF0000;
float:none!important;
padding-bottom:0px!important;
margin:0px;
cursor:pointer;
color:#FFF;
line-height:26px;
padding-top:0px!important;
height:26px;
}
.tb-shop .float_bd .ks-active{
display:none!important;
visibility:hidden!important;
}
.tb-shop .float_bd .float_open{
width:20px;
line-height:120%!important;
height:110px!important;
}
.tb-shop .float_bd .float_close{
display:block;
visibility:visible;
width:128px;
}
.tb-shop .float_ad .ks-switchable-content{
background:#F0EFEF;
}
.tb-shop .float_ww .ks-switchable-content{
background:#F0EFEF;
}
.tb-shop .float_ad .float_open{
left:0px;
position:absolute;
}
.tb-shop .float_ww .float_open{
right:0px;
position:absolute;
}