在DEDECMS 3.1lit里實現幻燈片效果(區別于官方，增添了選擇按鈕)_DedeCms教程
教程Tag：暫無Tag,歡迎添加,賺取U幣!
<style type="text/css">
<!--
/********焦點圖*********/
/*圖片層*/
#pic_layer{ position:absolute; z-index:1; width:325px; height:225px; overflow:hidden;}
/*焦點文字*/
#f_text{width:250px; height:23px;line-height:23px; font-weight:bold; overflow:hidden;
float:left;filter:dropshadow(color=#EEEEEC,offx=1,offy=1);}
/*按鈕*/
#f_button_num{ width:72px;height:23px; padding-top:2px; overflow:hidden; float:right;}
.f_button_on{width:17px; height:17px; margin-left:1px; float:right; background:url
([img]http://www.pclady.com.cn/images/06/06index2_button.gif[/img]); overflow:hidden; text-
align:center; color:#fff; font-weight:bold; line-height:17px; cursor:pointer !important;
cursor:hand;}
.f_button_off{width:17px;height:17px; margin-left:1px;float:right;overflow:hidden;text-
align:center;color:#000;font-weight:bold;line-height:17px;cursor:pointer !important;
cursor:hand;}
/*字size*/
.f12b{font-size:12px;font-weight:bolder;}
.f16b{font-size:16px;font-weight:bolder;}
/*顏色*/
.c1{color:#565656;}
.c2{color:#9D499A;}
.c3{color:#fff;}
.c4{color:#4E3C29;}
.c5{color:#FF7E00;}
.c6{color:#6B6866;}
.c7{color:#AE8300;}
.c8{color:#DE108C;}
.c9{color:#BD2A63;}
.c10{color:#464646;}
/**** 圖片外誆 ****/ .sp_pic img{border:#FFF 4px solid;}
/*切換2*/
#line_lay{width:559px; height:190px;overflow:hidden; float:right;}
#line_lay .title{width:24px;height:190px; float:left;margin-left:1px;cursor:hand; font-
weight:bold; text-align:center; padding-top:25px;line-height:16px;}
#line_lay .line_content{ width:360px; height:190px; margin-
left:1px;display:none;float:left; background:#D3D3D3;}
#line_lay #line1{width:68px;height:190px;cursor:hand;background: url
([img]http://www.pclady.com.cn/images/06/06index2__36.jpg[/img]);}
#line2{background: #E0CEE2 url([img]http://www.pclady.com.cn/images/06/06index2__38.gif[/img]) no-
repeat top; color:#9E01B1;}
#line3{background: #ECE0C1 url([img]http://www.pclady.com.cn/images/06/06index2__47.gif[/img]) no-
repeat top; color:#B88A16;}
#line4{background: #EAC6D4 url([img]http://www.pclady.com.cn/images/06/06index2__43.gif[/img]) no-
repeat top; color:#C3356D;}
#line5{background: #C5DBE6 url([img]http://www.pclady.com.cn/images/06/06index2__45.gif[/img]) no-
repeat top; color:#006BBE;}
#line6{background: #F2E2C7 url([img]http://www.pclady.com.cn/images/06/06index2__47.gif[/img]) no-
repeat top; color:#FF9600;}
/*line_point*/
.lp{ width:98%; height:1px; overflow:hidden;border-bottom:1px #7F7F7F dashed; }
-->
</style>
<table height="240" border="0" cellpadding="0" cellspacing="0" style="margin-top:1px;">
<tr>
<td width="5" bgcolor="#A1A1A1"></td>
<!--
/********焦點圖*********/
/*圖片層*/
#pic_layer{ position:absolute; z-index:1; width:325px; height:225px; overflow:hidden;}
/*焦點文字*/
#f_text{width:250px; height:23px;line-height:23px; font-weight:bold; overflow:hidden;
float:left;filter:dropshadow(color=#EEEEEC,offx=1,offy=1);}
/*按鈕*/
#f_button_num{ width:72px;height:23px; padding-top:2px; overflow:hidden; float:right;}
.f_button_on{width:17px; height:17px; margin-left:1px; float:right; background:url
([img]http://www.pclady.com.cn/images/06/06index2_button.gif[/img]); overflow:hidden; text-
align:center; color:#fff; font-weight:bold; line-height:17px; cursor:pointer !important;
cursor:hand;}
.f_button_off{width:17px;height:17px; margin-left:1px;float:right;overflow:hidden;text-
align:center;color:#000;font-weight:bold;line-height:17px;cursor:pointer !important;
cursor:hand;}
/*字size*/
.f12b{font-size:12px;font-weight:bolder;}
.f16b{font-size:16px;font-weight:bolder;}
/*顏色*/
.c1{color:#565656;}
.c2{color:#9D499A;}
.c3{color:#fff;}
.c4{color:#4E3C29;}
.c5{color:#FF7E00;}
.c6{color:#6B6866;}
.c7{color:#AE8300;}
.c8{color:#DE108C;}
.c9{color:#BD2A63;}
.c10{color:#464646;}
/**** 圖片外誆 ****/ .sp_pic img{border:#FFF 4px solid;}
/*切換2*/
#line_lay{width:559px; height:190px;overflow:hidden; float:right;}
#line_lay .title{width:24px;height:190px; float:left;margin-left:1px;cursor:hand; font-
weight:bold; text-align:center; padding-top:25px;line-height:16px;}
#line_lay .line_content{ width:360px; height:190px; margin-
left:1px;display:none;float:left; background:#D3D3D3;}
#line_lay #line1{width:68px;height:190px;cursor:hand;background: url
([img]http://www.pclady.com.cn/images/06/06index2__36.jpg[/img]);}
#line2{background: #E0CEE2 url([img]http://www.pclady.com.cn/images/06/06index2__38.gif[/img]) no-
repeat top; color:#9E01B1;}
#line3{background: #ECE0C1 url([img]http://www.pclady.com.cn/images/06/06index2__47.gif[/img]) no-
repeat top; color:#B88A16;}
#line4{background: #EAC6D4 url([img]http://www.pclady.com.cn/images/06/06index2__43.gif[/img]) no-
repeat top; color:#C3356D;}
#line5{background: #C5DBE6 url([img]http://www.pclady.com.cn/images/06/06index2__45.gif[/img]) no-
repeat top; color:#006BBE;}
#line6{background: #F2E2C7 url([img]http://www.pclady.com.cn/images/06/06index2__47.gif[/img]) no-
repeat top; color:#FF9600;}
/*line_point*/
.lp{ width:98%; height:1px; overflow:hidden;border-bottom:1px #7F7F7F dashed; }
-->
</style>
<table height="240" border="0" cellpadding="0" cellspacing="0" style="margin-top:1px;">
<tr>
<td width="5" bgcolor="#A1A1A1"></td>
相關DedeCms教程：
- Dedecms生成百度地圖圖文教程
- 織夢dedecms生成下拉式友情鏈接列表
- DEDECMS使用拼音首字母做欄目名稱
- 織夢DEDECMS站群增強版 DedeCMS搭建站群首選
- DedeCMS Error:Tag disabled:php錯誤的完整處理方法
- dedecms編碼轉換方法 gbk轉UTF-8,UTF-8轉GBK
- 防XSS,sql注射,代碼執行,文件包含的通用代碼
- DedeCms教程:優化DedeCMS搜索結果
- DedeCms教程:Linux+Apache+PHP+MySQL服務器環境(CentOS篇)
- DedeCms教程:LuManager服務器管理軟件安裝DEDECMS軟件
- DedeCms教程:Ubuntu/Debian上安裝 PHP 5.3, Nginx 和 PHP-fpm
- DedeCms教程:windows server 2003 php 環境搭建
。