100分求解一个兼容w3c标准的问题

caotian2000 2006-12-25 04:28:29

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>请各位大是帮忙</title>
<script>

function ScrollBar(id, clipH, thumbMax, arrowMax)
{
this.getMembers($(id));
this.docH = parseInt($('content').scrollHeight);
this.scrollH = this.docH -clipH;
this.clipH = clipH
this.markersMax = parseInt(this.markers.style.height) - 3
this.thumbMax = parseInt(this.thumbContainer.style.height) - this.thumbImg.height
this.thumb.obj = this
this.thumb.onmousedown = this.startDrag
}

ScrollBar.prototype.getMembers = function(a) {
var c = a.childNodes ? a.childNodes : a.children, cn
if (c) {
for (var i = 0; i < c.length; i++) {
cn = c[i].className
if (cn == "container") this.container = c[i]
else if (cn == "content") this.content = c[i]
else if (cn == "markers") this.markers = c[i]
else if (cn == "thumb") this.thumb = c[i]
else if (cn == "skip") this.skip = c[i]
else if (cn == "thumbImg") this.thumbImg = c[i]
else if (cn == "arrowImg") this.arrowImg = c[i]
else if (cn == "thumbContainer") this.thumbContainer = c[i]
if ((c[i].childNodes ? c[i].childNodes : c[i].children).length > 0)
this.getMembers(c[i])
}
}
}

ScrollBar.prototype.startDrag = function(e) {
if (!e) e = window.event
var ey = e.pageY ? e.pageY : e.y
this.dragLastY = ey
this.dragStartOffset = ey - parseInt(this.style.top)
ScrollBar.oldMouseMove = document.onmousemove
ScrollBar.oldMouseUp = document.onmouseup
ScrollBar.current = this.obj
document.onmousemove = this.obj.doDrag
document.onmouseup = this.obj.stopDrag
if (this.obj.aniTimer) window.clearInterval(this.obj.aniTimer)
return false;
}

ScrollBar.prototype.doDrag = function(e) {
if (!e) e = window.event
var obj = ScrollBar.current
var ey = (e.pageY ? e.pageY : e.y)
var dy = ey - obj.thumb.dragLastY
var ny = parseInt(obj.thumb.style.top) + dy
if (ny >= obj.thumbMax) obj.thumb.dragLastY = obj.thumbMax + obj.thumb.dragStartOffset
else if (ny < 0) obj.thumb.dragLastY = obj.thumb.dragStartOffset
else obj.thumb.dragLastY = ey
ny = Math.min(Math.max(ny, 0), obj.thumbMax)
obj.jumpTo(ny * obj.scrollH / obj.thumbMax)
return false;
}

ScrollBar.prototype.stopDrag = function() {
this.onmousemove = ScrollBar.oldMouseMove ? this.oldMouseMove : null
this.onmouseup = ScrollBar.oldMouseUp ? this.oldMouseUp : null
}

ScrollBar.prototype.jumpTo = function(ny) {
this.thumb.style.top = Math.round(ny * this.thumbMax / this.scrollH)
this.content.style.top = -ny
}

function $(s) {
return (document.getElementById ? document.getElementById(s) : document.all[s])
}
</script>
</head>
<body>

<div id="externals" class="ScrollBar" style="top:0px; width:445px; float:left; ">
<div class="container" style="position:absolute; width:422px; height:400px; overflow:hidden; float:left;">
<div class="content" style="position:absolute; top:0px;" id="content">
哈哈<br>哈哈<br>哈哈<br>哈哈sdfsdf<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>
哈哈<br>哈哈<br>哈哈<br>哈哈234<br>哈哈32423<br>哈哈<br>哈哈sdfsdf<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈fgsgsgsd<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>
哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈<br>哈哈sdfsdf<br>哈哈<br>哈哈<br>哈哈<br>
</div>
</div><div style=" background:url(http://album.sina.com.cn/pic/553c6d6002000ees); width:21px; height:400px; float:right;"> <div class="scrollBar" style=" float:left; width:14px; height:400px; top: -18px; ">
<div class="thumbContainer" style=" position:absolute; top:40px; width:9px; height:355px; float:right;">
<div class="thumb" style="position:absolute;top:0px; cursor:pointer; cursor:hand; ; width: 8px; height: 35px; float:right;"><img class="thumbImg" src="http://album.sina.com.cn/pic/553c6d6002000eet" width="21" height="40" /></div>
</div>
<div class="markers" style=" top:60px; width:7px; height:159px; display:none"></div>
</div></div>
</div>

<script language="javascript">new ScrollBar("externals", 160)</script>
</body></html>

...全文

138 4 打赏收藏转发到动态举报

写回复

用AI写文章

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

caotian2000 2006-12-25

打赏
举报

靠,少加个px也不行嘛? 要求也太严格了吧,日

ice_berg16 2006-12-25

打赏
举报

73行

this.thumb.style.top = Math.round(ny * this.thumbMax / this.scrollH);
this.content.style.top = -ny;

=>

this.thumb.style.top = Math.round(ny * this.thumbMax / this.scrollH) + "px";
this.content.style.top = -ny + "px";

caotian2000 2006-12-25