帝国论坛帝国网站管理系统交流区模板/标签/插件共享交流一个不错的头条效果的标签 【本版专题贴子】  
 1/10     1 2 3 4 5 6 7 8 9 10 ›› ›|
主题:一个不错的头条效果的标签 [加入收藏夹]   

禾火木风
用户头衔:嘉宾

精华贴   :11
发贴数   :5478
经验值   :14181
注册时间:2006-03-02
信息 搜索 好友 发送悄悄话 精益求精-帝国网站管理系统7.5正式版开源发布】   [第 1 楼]
一个不错的头条效果的标签
效果演示:
http://www.5000sky.com

是从网易弄过来的,原来的比较麻烦,在帝国里也不知道怎么能实现,所以改了一下。。。效果还是一样的。没想到在帝国里弄起来还挺简单的。为什么不用FLASH标签?一个是这里想读出简介,还想加上评论的链接,另外,文字的更有利于搜索引擎的收录

上传以下图片:


[该贴被修改 2 次,最后修改时间 2006-07-04 19:37:05 ]


梦想设计 成就你的设计梦想
2006-07-04 19:28:45 已设置保密 顶部 回复 引用 报告 编辑 删除

禾火木风
用户头衔:嘉宾

精华贴   :11
发贴数   :5478
经验值   :14181
注册时间:2006-03-02
信息 搜索 好友 发送悄悄话 免费开源-EBMA系统:更安全的MYSQL管理和备份系统】   [第 2 楼]

页面模板内容

<script language="javascript">
var nn;
nn=1;
setTimeout('change_img()',2000);
function change_img()
{
if(nn>3) nn=1
setTimeout('setFocus1('+nn+')',5000);
nn++;
tt=setTimeout('change_img()',5000);
}
function setFocus1(i)
{
selectLayer1(i);
}
function selectLayer1(i)
{
switch(i)
{
case 1:
document.getElementById("focusPic1").style.display="block";
document.getElementById("focusPic2").style.display="none";
document.getElementById("focusPic3").style.display="none";
break;
case 2:
document.getElementById("focusPic1").style.display="none";
document.getElementById("focusPic2").style.display="block";
document.getElementById("focusPic3").style.display="none";
break;
case 3:
document.getElementById("focusPic1").style.display="none";
document.getElementById("focusPic2").style.display="none";
document.getElementById("focusPic3").style.display="block";
break;
}
}
</script>
<div id="focusPic">
<div class="focusPic">
[!--empirenews.listtemp--]<!--list.var1-->[!--empirenews.listtemp--]
</div>
</div>


列表内容模板
(list.var)

<div id="focusPic[!--no.num--]">
<div class="pic"><a href="[!--titleurl--]"><img src="[!--titlepic--]" alt="[!--oldtitle--]" width="360" height="200" /></a></div>
      <h1><a href="[!--titleurl--]">[!--title--]</a></h1>
      <div class="text">[!--smalltext--]... <a href="[!--news.url--]e/pl?classid=[!--classid--]&amp;id=[!--id--]" class="font-f60">我要评论&gt;&gt;</a></div>
<div class="textNum">
<ul class="bg[!--no.num--]">
<li><a href="javascript:setFocus1(1);" target="_self">1</a></li><li><a href="javascript:setFocus1(2);" target="_self">2</a></li><li><a href="javascript:setFocus1(3);" target="_self">3</a></li>
</ul>
</div>
<div class="clear"></div>
</div>


在你的CSS里加上下面的样式。。。
/*- 焦点图片部分 --------------------------- */
#focusPic {
        word-break:break-all;
        margin: 0 0 6px;
        height: 296px;
        overflow: hidden;
        background: #FFFFFF;
}
#focusPic1,
#focusPic2,
#focusPic3 {
        margin: 0 0 10px;
}
.focusPic .pic {
        overflow: hidden;
}
.focusPic .text {
        height: 42px;
        margin: 0;
        padding: 0;
}
.textNum {
        text-align: right;
}
.textNum ul {
        padding: 0px;
        margin: 0px;
}
.textNum .bg1 {
        background: url(num1.gif) no-repeat right top;
        width: 90px;
}
.textNum .bg2 {
        background: url(num2.gif) no-repeat right top;
        width: 90px;
}
.textNum .bg3 {
        background: url(num3.gif) no-repeat right top;
        width: 90px;
}
.textNum .bg4 {
        background: url(num4.gif) no-repeat right top;
        width: 90px;
}
.focusPic .textNum li {
        display: block;
        background: none;
        font-weight: bold;
        float: left;
        width: 28px;
        color: #fff;
        list-style-type: none;
        text-align:center;
        padding: 0px;
        margin: 1px 0 0;
        font-size: 11px;
}
.textNum li a {
        color: #fff;
        padding: 0px 3px;
}
.textNum li a:visited {
        color: #fff;
}
.textNum li a:hover {
        color: #ff0;
}
#focusPic h1 {
        font-size:18px;
        padding:4px 0px 0;
        margin:0px;
}
#focusPic h1 a{
        color:#f60;
}
#focusPic h1 a:hover{
        color:#f60;
        text-decoration: underline;
}



梦想设计 成就你的设计梦想
2006-07-04 19:34:38 已设置保密 顶部 回复 引用 报告 编辑 删除

沒氣雪碧
用户头衔:进士

精华贴   :1
发贴数   :1203
经验值   :3265
注册时间:2006-04-05
信息 搜索 好友 发送悄悄话 精益求精-帝国网站管理系统7.5正式版开源发布】   [第 3 楼]

顶 支持 以后用!



仿任意网站模版制作:
200元/套起
免费帝国模版站 http://www.ecmsjz.cn/
后期免费提供相关技术支持。
SEO排名服务,价格优惠。没意向勿扰.案例很多.
QQ 8363204 (请注明: 模版制作)
收徒弟200/位.
2006-07-04 19:41:09 已设置保密 顶部 回复 引用 报告 编辑 删除

wm_chief
用户头衔:管理员

精华贴   :21
发贴数   :48941
经验值   :114161
注册时间:2002-10-30
信息 搜索 好友 发送悄悄话 免费开源-EBMA系统:更安全的MYSQL管理和备份系统】   [第 4 楼]

同上



[零基础入门教程] [模板制作教程] [采集使用教程]
2006-07-04 20:09:53 已设置保密 顶部 回复 引用 报告 编辑 删除

nbljm
用户头衔:举人 *

精华贴   :0
发贴数   :347
经验值   :1245
注册时间:2006-03-14
信息 搜索 好友 发送悄悄话 精益求精-帝国网站管理系统7.5正式版开源发布】   [第 5 楼]

同上




2006-07-04 20:29:02 已设置保密 顶部 回复 引用 报告 编辑 删除

禾火木风
用户头衔:嘉宾

精华贴   :11
发贴数   :5478
经验值   :14181
注册时间:2006-03-02
信息 搜索 好友 发送悄悄话 免费开源-EBMA系统:更安全的MYSQL管理和备份系统】   [第 6 楼]

上面的标签被自动转换了..........弄了个压缩包,需要的直接下载吧

上传以下附件:
[下载 *.rar](文件大小:1.85 KB,下载次数:691)



梦想设计 成就你的设计梦想
2006-07-05 09:02:05 已设置保密 顶部 回复 引用 报告 编辑 删除

phamlily
用户头衔:进士 *

精华贴   :1
发贴数   :1442
经验值   :2557
注册时间:2006-03-28
信息 搜索 好友 发送悄悄话 精益求精-帝国网站管理系统7.5正式版开源发布】   [第 7 楼]

好复杂……看不懂……但还是力顶一下。要用时再研究了……555555555,偶是菜鸟。



我是菜鸟……跳过……
2006-07-05 09:06:44 已设置保密 顶部 回复 引用 报告 编辑 删除

pppaaa
用户头衔:举人

精华贴   :0
发贴数   :148
经验值   :904
注册时间:2006-02-08
信息 搜索 好友 发送悄悄话 免费开源-EBMA系统:更安全的MYSQL管理和备份系统】   [第 8 楼]

标签如何调用??  [showclasstemp]???????[/showclasstemp]




2006-07-05 12:28:12 已设置保密 顶部 回复 引用 报告 编辑 删除

禾火木风
用户头衔:嘉宾

精华贴   :11
发贴数   :5478
经验值   :14181
注册时间:2006-03-02
信息 搜索 好友 发送悄悄话 精益求精-帝国网站管理系统7.5正式版开源发布】   [第 9 楼]

用万能标签



梦想设计 成就你的设计梦想
2006-07-05 13:09:21 已设置保密 顶部 回复 引用 报告 编辑 删除

yingnt
用户头衔:嘉宾

精华贴   :6
发贴数   :6831
经验值   :19382
注册时间:2006-01-01
信息 搜索 好友 发送悄悄话 免费开源-EBMA系统:更安全的MYSQL管理和备份系统】   [第 10 楼]

老套了,有盗版的




模板定制,开发,v7.2 qq,微博,百度登陆出售等 www.ecmsjz.cn QQ 415204
可长期合作!
dedecms转帝国7.2

帝国群:48024477

2006-07-05 22:09:01 已设置保密 顶部 回复 引用 报告 编辑 删除
 1/10     1 2 3 4 5 6 7 8 9 10 ›› ›|

快速回复
内容

表情
使用EBB代码 使用smile代码 显示签名 自动分析url 自动分析img
     【进入高级模式】   (按 Ctrl+Enter 直接提交)
    顶部  加入收藏夹
关于帝国 | 广告服务 | 联系我们 | 法律声明 | 隐私条款 | 许可协议
Powered by: EBB Version 2.2.1