js新闻滚动和弹出div层效果
<style type="text/css">
#scroll
{
margin: 0;
padding: 4px 0;
list-style: none;
width: 100%;
height: 20px;
overflow: hidden;
}
#scroll li
{
margin: 0;
padding: 0 4px;
font-size: 12px;
height: 20px;
line-height: 20px;
}
.black_overlay
{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index: 1001;
-moz-opacity: 0.8;
opacity: .80;
filter: alpha(opacity=88);
}
.white_content
{
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 55%;
height: 55%;
padding: 20px;
border: 3px solid #256BB6;
background-color: white;
z-index: 1002;
overflow: auto;
background-color:#FFFFFF;
}
</style>
---------------------------------------------------------------------------------------------------------------------------------------------------------
<div id="light" class="white_content">
<span style="font-size: 20px; margin-left: 300px">通知公告</span><span style="float: right">
<a href="javascript:void(0)" onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">
<img src="/DesktopModules/FAQs/image/gif-0965.gif" /></a></span>
<%=Publishnews2%>
</div>
<div id="fade" class="black_overlay">
</div>
------------------------------------------------------------------------------------------------------------------------------------------------------------
window.onload = function () {
dMarquee('scroll');
}
function dMarquee(id) {
var speed = 30; //速度
var stop = 3000; //停止时间
var ul = document.getElementById(id);
var rows = ul.getElementsByTagName('li').length;
var height = ul.getElementsByTagName('li')[0].offsetHeight;
ul.innerHTML += ul.innerHTML;
var timeID = false;
var play = function () {
ul.scrollTop++;
if (ul.scrollTop == rows * height) {
ul.scrollTop = 0;
}
if (ul.scrollTop % height == 0) {
timeID = setTimeout(play, stop);
} else {
timeID = setTimeout(play, speed);
}
}
timeID = setTimeout(play, stop);
ul.onmouseover = function () { clearTimeout(timeID); }
ul.onmouseout = play;
}
function getpublish() {
document.getElementById('light').style.display = 'block';
document.getElementById('fade').style.display = ''
}