350装修平台已服务318多万家 淘宝店装修,拥有25万多个 350代理, 今日已售488 套模板 客户端下载 350教程论坛 350后台登陆 咨询邮箱 咨询邮箱:350@seo-lv.com 350模板官方微博 350模板微信
不用css能做出淘宝店的悬浮效果
发表日期:2015-08-07 09:47   文章编辑:350模板官网小编    浏览次数:
 
开淘宝店装修时很重要的,店铺有些效果不容易做出来,我们都知道淘宝官方把fixed属性屏蔽了,现在没办法使用悬浮效果了。只能通过购买模块或者其他方法来实现。那么下面给大家讲解一种简单的悬浮方法,以及相应的优缺点。希望能为大家店铺装修带来一点帮助!
1、优点:无需调用官方一些悬浮的CSS来实现,也不需要担心会失效,可以说会永久使用。
2、缺点:当然既然不是直接写fiexd属性实现,那肯定有自己的缺陷,就是只能实现单个悬浮链接,如果想实现很多分类的链接,那就需要其他方法来破解了。
下面是代码:
 
1.<!--悬浮链接-->
2.  <div class="footer-more-trigger miser-fiexd" style="border:0px; padding:0px; width:190px; height:auto; ;top:0px; left:auto;">
3.      <a href="#" target="_blank">
4.          <div class="sn-simple-logo most-footer"
style="border:0;padding:0;opacity:1;width:140px;height:9999999px;left:385px;top:110px;border:none;padding:0;overflow:hidden;background:none;"> </div>
5.          </a>
6.  </div>
7.  <!--悬浮链接结束-->
下面是悬浮使用方法:
1、可以通过自定义模块背景固定或者直接通过固定背景代码,在页面背景先做出一个悬浮的图片
2、然后将这段代码放进任意一个自定义模块里面,通过调整参数来控制链接的位置
<!--悬浮链接-->
   <div class="footer-more-trigger miser-fiexd" style="border:0px; padding:0px; width:190px; height:auto; ;top:0px; left:auto;">
       <a href="#" target="_blank">
           <div class="sn-simple-logo most-footer" style="border:0;padding:0;opacity:1;width:140px;height:9999999px;left:385px;top:110px;border:none;padding:0;overflow:hidden;background:none;"> </div>
           </a>
   </div>
   <!--悬浮链接结束-->
有其他宽度需要改的可以在代码里面进行改动,希望能给大家带来帮助!

店铺模板

350店铺模板

查看模板 注册领取

手机模板

350手机模板

查看模板 注册领取

详情模板

350详情模板

查看模板 注册领取

免费领取

海报模板

350海报模板

在线设计

购买/价格

工具

350更多工具

350主图视频 更多工具
标签:    
如没特殊注明,文章均为350模板官网原创,转载请注明来自http://www.seo-lv.com//zxzs/258.html
相关文章推荐