打印

向上滚动式公告！居中问题

ljmtidilgw

高级会员

Rank: 4

帖子: 245
积分: 710
威望: 14
金币: 325
注册时间: 2006-8-9

1^# 大中小发表于 2007-1-26 07:18 只看该作者

向上滚动式公告！居中问题

向上滚动式公告！原文在：
http://www.discuz.net/thread-422573-1-1.html###
我在子扬左分拦风格下，公告不居中，拿位给指点以下。现谢谢了！

我的网站是
www.eswnman.com

“东南西北人”中英工程论坛

TOP

ljmtidilgw

高级会员

Rank: 4

帖子: 245
积分: 710
威望: 14
金币: 325
注册时间: 2006-8-9

2^# 大中小发表于 2007-1-26 07:19 只看该作者

************************************************************************************
            <div id="announcement" style="clear: both; width: {TABLEWIDTH}">$announcements</div>
  <script type="text/javascript">announcement();</script>
************************************************************************************

被替换成以下：
<div id="so1">
$announcements
            </div><div id='so2' style='position:absolute;z-index:1;visibility:hidden'></div>
<script>
marqueesHeight=16;
stopscroll=false;
document.all.so1.scrollTop=0;
with(so1){
style.width=776;
style.height=marqueesHeight;
style.overflowX='visible';
style.overflowY='hidden';
noWrap=true;
onmouseover=new Function('stopscroll=true');
onmouseout=new Function('stopscroll=false');
}
preTop=0; currentTop=0; stoptime=0;
function init_srolltext(){
document.all.so2.innerHTML='';
document.all.so2.innerHTML+=document.all.so1.innerHTML;
document.all.so1.innerHTML=document.all.so2.innerHTML+document.all.so2.innerHTML;
setInterval('scrollUp()',1);
}
function scrollUp(){
if(stopscroll==true) return;
currentTop+=1;
if(currentTop==16)
{
stoptime+=1;
currentTop-=1;
if(stoptime==300)
{
currentTop=0;
stoptime=0;
}
}
else {
preTop=document.all.so1.scrollTop;
document.all.so1.scrollTop+=1;
if(preTop==document.all.so1.scrollTop){
document.all.so1.scrollTop=document.all.so2.offsetHeight-marqueesHeight;
document.all.so1.scrollTop+=1;
}
}
}
setTimeout('init_srolltext()', 3000)
</script>

“东南西北人”中英工程论坛

TOP

wind_7th

新手上路

Rank: 1

帖子: 11
积分: 26
威望: 0
金币: 15
注册时间: 2005-9-7

3^# 大中小发表于 2007-2-8 20:15 只看该作者

lite1.0 rc1 里修改的是\include\common.js，把原来的：

引用:

var marqueeHeight=20;

改为

引用:

var marqueeHeight=16;

就能修正公告轮换后标题位置不正的问题。

TOP

shyer

中级会员

Rank: 3 Rank: 3

帖子: 89
积分: 379
威望: 16
金币: 130
来自: 中国茶都
注册时间: 2005-12-27

4^# 大中小发表于 2007-2-16 01:14 只看该作者

不是很懂JS，研究了好久，发现问题的根源，FOR DZ LITE 的
公告那部分的HTML代码是这样的

复制内容到剪贴板

代码:

<div id=marqueeBox onmouseover="clearInterval(marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval(\'startMarquee()\',marqueeDelay)">

<div>公告内容1</div>

<div>公告内容2</div>

</div>

不居中的原因是外部那一层DIV(marqueeBox)定义的高度跟内部DIV层(<div>公告内容1</div>)的高度不一致引起的,因此只须在样式里定义，让他们的高度一致就可以了

测试代码

复制内容到剪贴板

代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> New Document </TITLE>

<link rel="stylesheet" type="text/css" id="css" href="http://www.freediscuz.net/bbs/forumdata/cache/style_3.css">

</HEAD>

<BODY>

<SCRIPT LANGUAGE="JavaScript">

var marqueeInterval=new Array();

var marqueeId=0;

var marqueeDelay=3000;

var marqueeHeight=20;

function initMarquee() {

        var str=marqueeContent[0];

        document.write('<style type="text/css">#marqueeBox{margin:0;padding:0;height:'+marqueeHeight+'px;overflow:hidden;}#marqueeBox div{margin:0;padding:0;line-height:'+marqueeHeight+'px;}</style>');

        document.write('<div id=marqueeBox onmouseover="clearInterval(marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval(\'startMarquee()\',marqueeDelay)"><div>'+str+'</div></div>');

        marqueeId++;

        marqueeInterval[0]=setInterval("startMarquee()",marqueeDelay);

}



function startMarquee() {

        if(marqueeId>=marqueeContent.length) marqueeId=0;

        var str=marqueeContent[marqueeId];

        marqueeId++;

        if($('marqueeBox').childNodes.length==1) {

                var nextLine=document.createElement('DIV');

                nextLine.innerHTML=str;

                $('marqueeBox').appendChild(nextLine);

        } else {

                $('marqueeBox').childNodes[0].innerHTML=str;

                $('marqueeBox').appendChild($('marqueeBox').childNodes[0]);

                $('marqueeBox').scrollTop=0;

        }

        clearInterval(marqueeInterval[1]);

        marqueeInterval[1]=setInterval("scrollMarquee()",20);

}



function scrollMarquee() {

        $('marqueeBox').scrollTop++;

        if($('marqueeBox').scrollTop%marqueeHeight==(marqueeHeight-1)){

                clearInterval(marqueeInterval[1]);

        }

}



function $(id) {

        return document.getElementById(id);

}

</SCRIPT>



<div class="maintable">

<table cellspacing="1" cellpadding="4" width="98%" align="center" class="tableborder">

<tr class="header"><td colspan="3">Discuz! Board 公告</td></tr>

<tr class="altbg2" align="center">

<td colspan="3" align="center">

<script language="javascript">

var marqueeContent=new Array();

marqueeContent[0]='<a href="announcement.php?id=18#18" target="_blank"><span class="bold"><font color="red">FreeDiscuz! 调整完成，所有用户安全提问与回答均已清空</font></span> (2007-1-15)</a>';

marqueeContent[1]='<a href="announcement.php?id=15#15" target="_blank"><span class="bold"><a href="viewthread.php?tid=2257" target="_blank"><font color="blue">Discuz! Lite 1.0 RC 1正式发布</font></a></span> (2007-1-4)</a>';

marqueeContent[2]='<a href="announcement.php?id=12#12" target="_blank"><span class="bold"><font color="FF0000">FreeDiscuz! 全面禁止广告</font></span> (2006-10-16)</a>';

initMarquee();

</script>

</td></tr></table><br></div>

</BODY>

</HTML>

引用:

document.write('<style type="text/css">#marqueeBox{margin:0;padding:0;height:'+marqueeHeight+'px;overflow:hidden;}#marqueeBox div{margin:0;padding:0;line-height:'+marqueeHeight+'px;}</style>');

这里把原来定义的样式去掉了，改为在这里写样式表控制，红色部分就是为了让DIV层的高度相一致，并且实现文字居中显示，这个高度可以在var marqueeHeight=20;里修改

common.js for Discuz! Lite 1.0 RC 1 [070115更新]

附件: 您所在的用户组无法下载或查看附件

TOP

ljmtidilgw

高级会员

Rank: 4

帖子: 245
积分: 710
威望: 14
金币: 325
注册时间: 2006-8-9

5^# 大中小发表于 2007-8-9 00:19 只看该作者

这个里面的方法哪个对？

“东南西北人”中英工程论坛

TOP