썸네일 이미지 무한 스크롤러 1 (마우스 오버시 일시정지 기능) > script

썸네일 이미지 무한 스크롤러 1 (마우스 오버시 일시정지 기능)

작성일 07-08-11 16:31

페이지 정보

작성자서방님 조회 166회 댓글 0건

본문

<html>
<head>
<title>http://www.blueb.co.kr</title>
</head>
<body>

; AuctionThum[2]="http://www.blueb.co.kr/SRC/flash/image/thum_11.jpg"
; AuctionLink[2]="http://www.blueb.co.kr"
; AuctionDesc[2]="이미지 설명 2"

; AuctionThum[3]="http://www.blueb.co.kr/SRC/flash/image/thum_03.jpg"
; AuctionLink[3]="http://www.blueb.co.kr"
; AuctionDesc[3]="이미지 설명 3"

; AuctionThum[4]="http://www.blueb.co.kr/SRC/flash/image/thum_04.jpg"
; AuctionLink[4]="http://www.blueb.co.kr"
; AuctionDesc[4]="이미지 설명 4"

; AuctionThum[5]="http://www.blueb.co.kr/SRC/flash/image/thum_12.jpg"
; AuctionLink[5]="http://www.blueb.co.kr"
; AuctionDesc[5]="이미지 설명 5"

; AuctionThum[6]="http://www.blueb.co.kr/SRC/flash/image/thum_06.jpg"
; AuctionLink[6]="http://www.blueb.co.kr"
; AuctionDesc[6]="이미지 설명 6"

; AuctionThum[7]="http://www.blueb.co.kr/SRC/flash/image/thum_07.jpg"
; AuctionLink[7]="http://www.blueb.co.kr"
; AuctionDesc[7]="이미지 설명 7"

; AuctionThum[8]="http://www.blueb.co.kr/SRC/flash/image/thum_08.jpg"
; AuctionLink[8]="http://www.blueb.co.kr"
; AuctionDesc[8]="이미지 설명 8"

; AuctionThum[9]="http://www.blueb.co.kr/SRC/flash/image/thum_09.jpg"
; AuctionLink[9]="http://www.blueb.co.kr"
; AuctionDesc[9]="이미지 설명 9"

; AuctionThum[10]="http://www.blueb.co.kr/SRC/flash/image/thum_10.jpg"
; AuctionLink[10]="http://www.blueb.co.kr"
; AuctionDesc[10]="이미지 설명 10"

; AuctionThum[11]="http://www.blueb.co.kr/SRC/flash/image/thum_17.jpg"
; AuctionLink[11]="http://www.blueb.co.kr"
; AuctionDesc[11]="이미지 설명 11"

;
; var scrollspeed ="30" //스크롤 속도
; var borderd ="1px" //보더두께
; var slideborder ="#555555" //보더색상
; var slidebgcolor="#ffffff" //배경색상
; var textcolor ="#222222" //텍스트 색상
; var gallerywidth="500" //슬라이더 가로크기
;

var slider1, slider2, maxWid=0; var sliderwidth=0;
var quot="'"; var scrollamount=-1; var thCnt=0;
var CrossSellimages=new Array();
for (var i=1; i<=AuctionThum.length; i++){if (AuctionThum[i]){thCnt++;
    if (!ImgWidRatio[i]) {ImgWidRatio[i]=ImgWidRatio[0]};
    CrossSellimages[thCnt]='<a href="'+AuctionLink[i]+'" target=_blank>'+
    '<img src="'+AuctionThum[i]+'" width="'+Math.round(64*ImgWidRatio[i])+'" height="64" hspace="2" vspace="4" border="0" '+
    ' onmouseover="thumbwow(this.alt,this.offsetLeft,this.offsetWidth,'+quot+AuctionDesc[i]+quot+')" '+
    ' title="" alt="'+i+'" ></a>';
    sliderwidth=sliderwidth+Math.round((64*ImgWidRatio[i])+4);
    if (ImgWidRatio[i]>maxWid){maxWid=ImgWidRatio[i]}
}};
var sliderheight="88";
var CrossSellStrip='<nobr>'+CrossSellimages.join("")+'</nobr>';
if (sliderwidth-maxWid*64<parseInt(gallerywidth)){gallerywidth=Math.abs(sliderwidth-maxWid*64)}
function setupGallery(){
    document.write('<table border="0" cellspacing="0" cellpadding="0" style="position:relative; border:'+borderd+' '+slideborder+' solid; background-color:'+slidebgcolor+'; width:'+(parseInt(gallerywidth)+2)+'px; height:90px;"><tr><td valign="top" align="center">');
    document.write('<div style="position:relative;width:'+gallerywidth+'px;height:89px;overflow:hidden;">');
    document.write('<div style="position:absolute;left:0px;bottom:0px;width:'+gallerywidth+'px;height:89px;" onMouseover="scrollamount=0" onMouseout="scrollamount=-1">');
    document.write('<div id="slidegroup1" style="position:absolute;left:0px;bottom:5px;"></div>');
    document.write('<div id="slidegroup2" style="position:absolute;left:-1000px;bottom:5px;"></div>');
    document.write('<div id="blowup" style="position:absolute;left:0px;bottom:0px;visibility:hidden;border:1px '+slideborder+' solid;" onmouseout="unwow()"></div>');
    document.write('</div></div>');
    document.write('</td></tr><tr><td align="center" id="slidelabel" style="padding:2px; font-family:sans-serif; font-size:14px; font-weight:normal; color:'+textcolor+'">');
    document.write(' ');
    document.write('</td></tr></table>');
};
function loadimages(){
    slider1=document.getElementById("slidegroup1");
    slider2=document.getElementById("slidegroup2");
    slider1.innerHTML=CrossSellStrip;
    slider2.innerHTML=CrossSellStrip;
    slider2.style.left=""+sliderwidth+"px";
    startaction=setInterval("slideleft()",parseInt(scrollspeed));
};
function slideleft(){
    if (parseInt(slider1.style.left)>(sliderwidth*(-1)))
      {slider1.style.left=(parseInt(slider1.style.left)+scrollamount)+"px"}
    else
      {slider1.style.left=(parseInt(slider2.style.left)+sliderwidth+scrollamount)+"px"}
    if (parseInt(slider2.style.left)>(sliderwidth*(-1)))
      {slider2.style.left=(parseInt(slider2.style.left)+scrollamount)+"px"}
    else
      {slider2.style.left=(parseInt(slider1.style.left)+sliderwidth)+"px"}
};
function thumbwow(num,thumOffset,thumSize,label){
    if (parseInt(slider1.style.left)<=0){
      if (thumOffset+parseInt(slider1.style.left)>0-thumSize){leftstart=thumOffset+parseInt(slider1.style.left)}else{leftstart=thumOffset+parseInt(slider2.style.left)}
    }
    else {
      if (thumOffset+parseInt(slider2.style.left)>0-thumSize){leftstart=thumOffset+parseInt(slider2.style.left)}else{leftstart=thumOffset+parseInt(slider1.style.left)}
    };
    document.getElementById("blowup").style.left=leftstart+0+(Math.round((thumSize-thumSize/0.8-2)/2))+"px";
    document.getElementById("blowup").innerHTML='<a href="'+AuctionLink[num]+'" title="'+label+'" target=_blank>'+
        '<img src="'+AuctionThum[num]+'" height="80" border="0" ></a>';
    document.getElementById("blowup").style.visibility="visible";
    document.getElementById("slidelabel").innerHTML=label;
};
function unwow(){document.getElementById("blowup").style.visibility="hidden";
    document.getElementById("slidelabel").innerHTML=document.getElementById("slidelabel").title
};
setupGallery();
loadimages();
</script>

</body>
</html>

댓글목록

등록된 댓글이 없습니다.