付费50元+湖北网风格 请人diy幻灯片

已有div+css的样式，只需将数据部分修改为可diy调用的就成

联系： qq  361652037

付费50元  

样式如付件图片 会的请加QQ  急 ！

顶顶顶顶

修收好了送再送别湖北网风格一份

看看百变幻灯片的制作教程

ARCHY` 发表于 2011-5-26 17:25
看看百变幻灯片的制作教程

看不明白呀 急

有需要可以联系我们 。

我们有整套最新湖北网风格X2版本 。可以联系我们 。

1. <style>
   
2. .bi_ws { float:left; width:450px; height:270px; background-color:#999999; overflow:hidden; }/*幻灯片的整体大小*/
   
3. .pi_cx { display:inline; position:relative; float:left; width:337px; height:258px; overflow:hidden; margin:6px 0 6px 6px; }/*大图片区域样式*/
   
4. .pi_cx div img { width:337px; height:258px; }/*大图片的大小*/
   
5. .bi_ws_op { margin-left: 8px;  position:absolute; left:5; bottom:0px; width:322px; height:70px; color:#FFF;  }/*字幕区定义*/
   
6. .bi_ws_opdiv { position:absolute; left:0; bottom:0px; width:337px; height:78px; background:#000; opacity:0.5; -moz-opacity:0.5; filter:alpha(opacity=50); }/*标题区背景 透明度50%*/
   
7. .bi_ws_op h2 a{ font-size: 18px; color:#FFF; font-weight: bolder; }/*文章标题样式*/
   
8. .bi_ws_op h2 a:hover { text-decoration:none; }/*文章标题鼠标经过样式*/
   
9. .bi_ws_btn { width:106px; height:270px; float:right;}/*右侧缩略图区域样式*/
   
10. .bi_ws_btn div {float:left; width:106px; height:60px; cursor:pointer;  margin:6px 0px 0; opacity:0.5; -moz-opacity:0.5; filter:alpha(opacity=70); }/*右侧缩略图区域中每个缩略图区域样式*/
    
11. .bi_ws_btn img { width:90px; height:54px; margin:2px 7px 0 ; border:1px solid #ffffff; }/*缩略图样式（非焦点缩略图）*/
    
12. .bi_ws .bi_ws_btn .on{ background:url(/forum/static/image/common/1-1.png) no-repeat 0 0; width:103px; height:60px;  opacity:1; -moz-opacity:1; filter:alpha(opacity=100); }/*焦点缩略图样式*/
    
13. 
    
14. .bi_ws_right { float:right; width:490px;}
    
15. 
    
16. 
    
17. </style>
    
18. <div class=" bi_ws slidebox">
    
19.     <div class="pi_cx slideshow">
    
20.     [loop]
    
21.       <div>
    
22.        <a href="{url}"{target}><img src="{pic}" width="{picwidth}" height="{picheight}" /></a>
    
23.        <div class="bi_ws_opdiv"></div>
    
24.        <div class="bi_ws_op">
    
25.          <ul>
    
26.           <li>
    
27.            <h2><a href="{url}"{target}>{title}</a></h2>
    
28.            <p><span style="font-size: 12px">{summary}</span></p>
    
29.           </li>
    
30.          </ul>
    
31.        </div>
    
32.       </div>
    
33.     [/loop]
    
34.     </div>
    
35.     <div class="bi_ws_btn slidebar" mevent="mouseover" >
    
36.     [loop1]
    
37.        <div><img src="{pic}" /></div>
    
38.     [/loop1]
    
39.     </div>
    
40. <script type="text/javascript">runslideshow();</script>
    
41. </div>
    
42. <div class="bi_ws_right">
    
43.   <div class="list" style="padding:0">
    
44.     <!--[diy=diy221]--><div id="diy221" class="area"></div><!--[/diy]-->
    
45.   </div>
    
46. </div>

复制代码

修改方式：

进入后台，门户-模块模板-添加选择“文章模块”，将以上代码复制到里面，起个诸如“魔幻幻灯片”的名字

在前台，DIY-在需要的位置，添加模块，选择刚才添加的模板即可。

注意，以上代码的整体区域为450×270，代码作用我已经注明，大小请自己调节。

希望能帮到你！！说钱太土了，来这里贵在相互学习、相互帮助！！

QQ：153651197

西安交友网 http://www.xianjiaoyou.com
网站名称;西安交友网
网站地址：http://www.xianjiaoyou.com

西安征婚网：http://www.xianjiaoyou.com/f-42-1.html
西安美女网：http://www.xianjiaoyou.com/f-43-1.html
西安帅哥网：http://www.xianjiaoyou.com/f-45-1.html
西安交友网地图：http://www.xianjiaoyou.com/sitemap.php
交换链接啦~！