基于手机wap版本发布(2014-03-24更新) 修该头部幻灯片

PHPWIND[民间论坛]数据搬迁导致丢失严重,用户数据基本全部损坏,十分遗憾来自phpwind.me的远古记忆

免责声明

yue 离线 13.9K阅读 25回复于 2014-05-01 11:29 发布在技术文献

本插件是基于http://phpwind.net.cn/r/33修改，将手机版版块顶部图片修改为幻灯片。

图片：wap首页.jpg

修改方法在forum_list.htm添加幻灯片代码，
默认的是这样的：

&lt;div class="mb10"&gt;
&lt;img src="{@theme:site.images}/3g/ad.png" width="280" /&gt;
&lt;/div&gt;

那么我们将其修改为：

&lt;style&gt;
* { margin: 0; padding: 0;}
.flexslider { position: relative; height: 120px; overflow: hidden; background: url(themes/site/default/images/3g/loading.gif) 50% no-repeat;}
.slides { position: relative; z-index: 1;}
.slides li { height: 400px;}
.flex-control-nav { position: absolute; bottom: 0px; z-index: 2; width: 100%; text-align: center;}
.flex-control-nav li { display: inline-block; width: 14px; height: 14px; margin: 0 5px; *display: inline; zoom: 1;}
.flex-control-nav a { display: inline-block; width: 14px; height: 14px; line-height: 40px; overflow: hidden; background: url(themes/site/default/images/3g/dot.png) right 0 no-repeat; cursor: pointer;}
.flex-control-nav .flex-active { background-position: 0 0;}
&lt;/style&gt;
      
&lt;div class="flexslider"&gt;
    &lt;ul class="slides"&gt;
        &lt;li style="background: url(themes/site/default/images/3g/img1.jpg) 50% 0 no-repeat;"&gt;&lt;/li&gt;
        &lt;li style="background: url(themes/site/default/images/3g/img2.jpg) 50% 0 no-repeat;"&gt;&lt;/li&gt;
        &lt;li style="background: url(themes/site/default/images/3g/img3.jpg) 50% 0 no-repeat;"&gt;&lt;/li&gt;
        &lt;li style="background: url(themes/site/default/images/3g/img4.jpg) 50% 0 no-repeat;"&gt;&lt;/li&gt;
        &lt;li style="background: url(themes/site/default/images/3g/img5.jpg) 50% 0 no-repeat;"&gt;&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
      
      
      
&lt;script src="themes/site/default/js/jquery-1.7.2.min.js"&gt;&lt;/script&gt;
&lt;script src="themes/site/default/js/jquery.flexslider-min.js"&gt;&lt;/script&gt;
&lt;script&gt;
$(window).load(function() {
    $('.flexslider').flexslider({
        directionNav: false,
        pauseOnAction: false
    });
});
&lt;/script&gt;