共享仿麦考林幻灯片/首页焦点图

2016-07-07 16:05 来源:www.chinab4c.com 作者:ecshop专家



QQ截图未命名.jpg

仿麦考林首页幻灯片.rar (480.27 KB)


预览点击这里,谢谢支持
  1. <div class="slides">
  2. <ul class="slide-pic">
  3. <li style="display: list-item;" class="cur"><a target="_blank" href="http://www.91kang.com/join.html"><img src="http://www.91kang.com/data/afficheimg/20101027rtfvzl.jpg" alt="招商加盟"></a></li>
  4. <li class="" style="display: none;"><a target="_blank" href="http://www.91kang.com/bipro.php"><img src="http://www.91kang.com/data/afficheimg/20101018jrzouu.jpg" alt="让宝宝远离生病"></a></li>
  5. <li style="display: none;" class=""><a target="_blank" href="http://www.91kang.com/goods-1405.html"><img src="http://www.91kang.com/data/afficheimg/20101018wgpwqa.jpg" alt="拜普洛伴我们健康成长"></a></li>
  6. <li style="display: none;" class=""><a target="_blank" href="goods-1413.html"><img src="http://www.91kang.com/data/afficheimg/20101018awnnad.jpg" alt="哥哥,我也要拜普洛"></a></li>
  7. <li class="" style="display: none;"><a target="_blank" href="http://www.91kang.com/topic.php?topic_id=1"><img src="
  8. http://www.91kang.com/data/afficheimg/20101018vnpxmh.gif" alt="EUROMODA最新款"></a></li>
  9. </ul>
  10. <ul class="slide-li op">
  11. <li class="cur"></li>
  12. <li class=""></li>
  13. <li class=""></li>
  14. <li class=""></li>
  15. <li class=""></li>
  16. </ul>
  17. <ul class="slide-li slide-txt">
  18. <li class="cur"><a target="_blank" href="http://www.91kang.com/join.html">招商加盟</a></li>
  19. <li class=""><a target="_blank" href="http://www.91kang.com/bipro.php">让宝宝远离生病</a></li>
  20. <li class=""><a target="_blank" href="http://www.91kang.com/goods-1405.html">拜普洛伴我们健康成长</a></li>
  21. <li class=""><a target="_blank" href="goods-1413.html">哥哥,我也要拜普洛</a></li>
  22. <li class=""><a target="_blank" href="http://www.91kang.com/topic.php?topic_id=1">促销专题</a></li>
  23. </ul>
  24. </div>
  25. <script src="themes/poonchikin/js/hp1.js"></script>
复制代码



这是我写到首页主广告管理/自定义编辑广告/选择类型:代码,里面的代码就是上面这些,CSS样式我写到style.css里了,还有一个JQ的js文件,那个凡客模板的头page_head.lib里本来就有调用,这里就不必在调出来了。你的没有就在前面加多个<script src="themes/poonchikin/js/jquery.js"></script>
红色部分自己修改,CSS样式参考附件
网站弄得不怎么样,请多多指教

回答:
同上,不会用饿

最简单就在图片在系统默认的幻灯片里面上传图片,然后转到自定义幻灯片,类型选代码,将我附近的那个html文件的代码写进去就行了。注意:CSS样式自己修改,2个js文件上传到模板,自定义代码里调用。so easy

做个记号,吃完饭来搞下

没用起!

效果不错,如果那个文字连接的背景色块有透明度那就更好!

有用的时候再来下



是有透明度的,你到我搞的网站去看看就知道了

怎么用啊 在哪个文件里写啊 说明白一点 谢谢

不是很明白,恳求帮助!zhijianpan

.slide-li 的值改为,.slide-li {bottom:0;left:0;position:absolute;filter:alpha(opacity=70);}

filter:alpha(opacity=70);IE的透明滤镜

好像跟transport.js文件冲突了,我删掉加载transport.js,就显示正常,恢复transport.js,就显示不正常了..
纠结.....

终于搞定了,碰到了几个问题
1、附件里的jquery.js,会跟系统里的transport.js冲突,我的系统是v2.7.2,图片切换过去就变空白了。
解决办法:去楼主网站那边,直接下载他的jquery.js.
2、css要重新改一下,不过现在只在ie6上面试,不知道其他版本的ie怎么样,晚点试一下。我主要改了长度,宽度,还有.slide-li的位置,透明效果看起来不错。。
3、一些css冲突,做一个id定议一下。。

你这个代码放到自定义里面以后修改幻灯图片和链接是不是要手动的更改? 而不是像官方那样上传了图片就自动获取的?