比如
你数据库存放的是 images/test.gif
页面所在位置：根目录/test/test.asp
那么读取后要加 ../images/test.gif
可以用无缝图片滚动效果 如：<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
* { margin: 0padding: 0}
body{ background-color:#1B1B1B}
#div1{ width: 800pxheight: 150pxposition: relativemargin: 100px autooverflow: hidden}
#div1 ul { width: 800pxheight: 150pxposition: relative}
#div1 ul li { height: 150pxfloat: leftlist-style: nonepadding-right:20px}
#div1 ul li img { width: 200pxheight: 150pxdisplay: inline-block}
a{ color: #B4B4B4}
</style>
<script type="text/javascript">
window.onload=function(){
var odiv = document.getElementById('div1')
var oul = odiv.getElementsByTagName('ul')[0]
var ali = oul.getElementsByTagName('li')
var spa = -2
oul.innerHTML=oul.innerHTML+oul.innerHTML
oul.style.width=ali[0].offsetWidth*ali.length+'px'
function move(){
if(oul.offsetLeft<-oul.offsetWidth/2){
oul.style.left='0'
}
if(oul.offsetLeft>0){
oul.style.left=-oul.offsetWidth/2+'px'
}
oul.style.left=oul.offsetLeft+spa+'px'
}
var timer = setInterval(move,30)
odiv.onmousemove=function(){clearInterval(timer)}
odiv.onmouseout=function(){timer = setInterval(move,30)}
document.getElementsByTagName('a')[0].onclick = function(){
spa=-2
}
document.getElementsByTagName('a')[1].onclick = function(){
spa=2
}
}
</script>
</head>
<body>
<a href="#" style=" display: blockmargin:0 autowidth: 50px">向左走</a>
<a href="#" style=" display: blockmargin:0 autowidth: 50px">向右走</a>
<div id="div1">
<ul>
<li><img src="img/1.jpg"/></li>
<li><img src="img/2.jpg"/></li>
<li><img src="img/3.jpg"/></li>
<li><img src="img/4.jpg"/></li>
</ul>
</div>
</body>
</html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）