`
yangfuchao418
  • 浏览: 162021 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

漂浮,鼠标拖动,自动变图,手动变图———史上最牛的四合一广告图片

阅读更多

<div id="img" style="position:absolute;">
<img src="images\T1BJ8dXjVEJ7BXXXXX.jpg_160x160.jpg"
onClick="pause_resume();">
</div>

<script>

var NowFrame = 1;
var MaxFrame = 4;
function show(d1) {
if(Number(d1)){
clearTimeout(theTimer);NowFrame=d1;}
for(var i=1;i<(MaxFrame+1);i++){
if(i==NowFrame)
document.getElementById('div'+NowFrame).style.display ='';else
document.getElementById('div'+i).style.display ='none';}
{ if(NowFrame == MaxFrame)NowFrame = 1;
else
NowFrame++;}
theTimer=setTimeout('show()', 2000);}
//=====================
var Obj
function MouseDown(obj){
Obj=obj
Obj.setCapture()
Obj.l=event.x-Obj.style.pixelLeft
Obj.t=event.y-Obj.style.pixelTop
}
function MouseMove(){
if(Obj!=null){
Obj.style.left = event.x-Obj.l
Obj.style.top = event.y-Obj.t
}
}
function MouseUp(){
if(Obj!=null){
Obj.releaseCapture()
Obj=null
}
}
//========================
<!-- Begin
var xPos = 20;
var yPos = document.body.clientHeight;
var step = 1;
var delay = 30;
var height = 0;
var Hoffset = 0;
var Woffset = 0;
var yon = 0;
var xon = 0;
var pause = true;
var interval;
img.style.top = yPos;
function changePos() {
width = document.body.clientWidth;
height = document.body.clientHeight;
Hoffset = img.offsetHeight;
Woffset = img.offsetWidth;
img.style.left = xPos + document.body.scrollLeft;
img.style.top = yPos + document.body.scrollTop;
if (yon) {
yPos = yPos + step;
}
else {
yPos = yPos - step;
}
if (yPos < 0) {
yon = 1;
yPos = 0;
}
if (yPos >= (height - Hoffset)) {
yon = 0;
yPos = (height - Hoffset);
}
if (xon) {
xPos = xPos + step;
}
else {
xPos = xPos - step;
}
if (xPos < 0) {
xon = 1;
xPos = 0;
}
if (xPos >= (width - Woffset)) {
xon = 0;
xPos = (width - Woffset);
}
}
function start() {
img.visibility = "visible";
interval = setInterval('changePos()', delay);
}
function pause_resume() {
if(pause) {
clearInterval(interval);
pause = false;
}
else {
interval = setInterval('changePos()',delay);
pause = true;
}
}
start();
// End -->
</script>

//===================================

<span
style='position: absolute; width: 200; height: 200; background: #FFFFFF'
onmousedown=MouseDown(this) onmousemove=MouseMove()
onmouseup=MouseUp()> <IMG src="images/ad-01.jpg"
style="display: none;" id="div1" border="0"> <IMG
src="images/ad-02.jpg" style="display: none;" id="div2"
border="0"> <IMG src="images/ad-03.jpg"
style="display: none;" id="div3" border="0"> <IMG
src="images/ad-04.jpg" style="display: none;" id="div4"
border="0">

<DIV style="position: absolute; left: 120px; top: 180px;"
align="center">
<A href="javascript:show(1)">1</A>&nbsp;
<A href="javascript:show(2)">2</A>&nbsp;
<A href="javascript:show(3)">3</A>&nbsp;
<A href="javascript:show(4)">4</A>&nbsp;
</DIV> </span>

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics