previousSibling 관련......
Posted: 2005 12 18 22:10 44
갤러리를 쓸 페이지인데요
그림이 화면 가운데 오도록 합니다.
만약 그림이 크면 화면 크기에 맞게 자동으로 줄어듭니다.
세로정렬도 가운데로 됩니다.
마우스 왼쪽클릭 이전그림 으로 갑니다
마우스 오른쪽 클릭 다음 그림 으로 갑니다.
이미 IE에서는 다 잘돌아갑니다.
제가 실력이 짧아서 그런지 파이어폭스에서는 화면이 아예 안나옵니다.
오직 마우스 왼쪽클릭, 오른쪽 클릭만 인식합니다.
그런데 제일 중요한것~! 자신의 이전개체랑 다음개체(previousSibling,nextSibling)이 전혀 안먹습니다.
너무 머리가 아픕니다. IE에서는 잘되는데 파이어 폭스에서도 잘되게 하는방법 없을까요?
그림이 화면 가운데 오도록 합니다.
만약 그림이 크면 화면 크기에 맞게 자동으로 줄어듭니다.
세로정렬도 가운데로 됩니다.
마우스 왼쪽클릭 이전그림 으로 갑니다
마우스 오른쪽 클릭 다음 그림 으로 갑니다.
이미 IE에서는 다 잘돌아갑니다.
제가 실력이 짧아서 그런지 파이어폭스에서는 화면이 아예 안나옵니다.
오직 마우스 왼쪽클릭, 오른쪽 클릭만 인식합니다.
그런데 제일 중요한것~! 자신의 이전개체랑 다음개체(previousSibling,nextSibling)이 전혀 안먹습니다.
너무 머리가 아픕니다. IE에서는 잘되는데 파이어 폭스에서도 잘되게 하는방법 없을까요?
Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Gallery </TITLE>
<style>
body {margin:0; background-color:#000; color:#0f0;}
.v100 {position:relative; width:100%; height:100%; overflow:hidden; text-align:center;}
</style>
</HEAD>
<BODY>
<div></div>
<div class="v100" onmousedown="javascript:mousehandler(this,event,'previous_page_URL');"><IMG SRC="../Pictures/이죽일놈의사랑(1467).jpg" WIDTH="400" HEIGHT="533" BORDER="0" ALT="그림-1" name="target_resize_image[]"> </div>
<div class="v100" onmousedown="javascript:mousehandler(this,event);"><IMG SRC="../Pictures/사진051127_46(5627).jpg" WIDTH="200" HEIGHT="200" BORDER="0" ALT="그림-2" name="target_resize_image[]"> </div>
<div class="v100" onmousedown="javascript:mousehandler(this,event);"><IMG SRC="../Pictures/이죽일놈의사랑(1467).jpg" WIDTH="400" HEIGHT="533" BORDER="0" ALT="그림-3" name="target_resize_image[]"> </div>
<div class="v100" onmousedown="javascript:mousehandler(this,event);"><IMG SRC="../Pictures/sexy-2/11___________________케.jpg" WIDTH="400" HEIGHT="601" BORDER="0" ALT="그림-4" name="target_resize_image[]"> </div>
<div class="v100" onmousedown="javascript:mousehandler(this,event,'next_page_URL');"><IMG SRC="../Pictures/이죽일놈의사랑(1467).jpg" WIDTH="400" HEIGHT="533" BORDER="0" ALT="그림-5" name="target_resize_image[]"> </div>
<div></div>
<script language="JavaScript">
// HTML 로 넘어온 <img ... > 태그의 폭이 테이블폭보다 크다면 테이블폭을 적용한다.
function resize_image()
{
var target = document.getElementsByName('target_resize_image[]');
var image_width = parseInt(document.body.offsetWidth);//alert (image_width);
var image_height = parseInt(document.body.offsetHeight);
var image_wh = parseFloat(image_width / image_height);//alert(image_wh);
for(i=0; i<target.length; i++) {
// 원래 사이즈를 저장해 놓는다
target[i].tmp_width = target[i].width;//alert(target[i].tmp_width);
target[i].tmp_height = target[i].height;
target[i].tmp_wh = parseFloat(target[i].width / target[i].height);//alert(target[i].tmp_wh);
// 이미지 폭이 테이블 폭보다 크다면 테이블폭에 맞춘다
if(target[i].tmp_wh > image_wh) {
if(target[i].width > image_width){
target[i].width = image_width;//alert(image_width);
target[i].height = parseInt(image_width / target[i].tmp_wh);//alert(target[i].height);
}
target[i].style['margin'] = parseInt((image_height - target[i].height) / 2) + ' 0';
//image_height = parseFloat(target[i].width / target[i].height)
//target[i].width = image_width;
//target[i].height = parseInt(image_width / image_height);
}else{
if(target[i].height > image_height) {
target[i].height = image_height;
target[i].width = parseInt(image_height * target[i].tmp_wh);
}else{
target[i].style['margin'] = parseInt((image_height - target[i].height) / 2) + ' 0';
}
}
}
}
window.onload = resize_image;
//첫번째 div 뺀 나머지 div 가림
function classChange() {
var divall = document.getElementsByTagName("div");
var divfirst = 0;
for (i=0;i<divall.length; i++) {
if (divall.item(i).className == "v100"){
if(divfirst>=1){
divall.item(i).style.display = "none";
}
divfirst++;
//return false;
}
}
}
document.onload = document.onload;
setTimeout('classChange()',1);
//왼쪽 클릭:이전, 오른쪽 클릭:다음
var isNS = (navigator.appName == "Netscape") ? 1 : 0;
var EnableRightClick = 0;
if(isNS)
document.captureEvents(Event.MOUSEDOWN||Event.MOUSEUP);
function mischandler(){
if(EnableRightClick==1){ return true; }
else {return false; }
}
function mousehandler(t,e,site){
if(EnableRightClick==1){ return true; }
var myevent = (isNS) ? e : event;
var eventbutton = (isNS) ? myevent.which : myevent.button;
if((eventbutton==1)) {//alert('left click');
if(t.previousSibling.className == 'v100'){
t.previousSibling.style.display = 'block';
t.style.display = 'none';
}else {
alert(site);//self.location = 'http://' + site;
}
return false;
}else{//alert('right click');
if(t.nextSibling.className) {
t.nextSibling.style.display = 'block';
t.style.display = 'none';
}else{//alert('right-click');
alert(site);//self.location = 'http://' + site;
}
return false;
}
}
function keyhandler(e) {
var myevent = (isNS) ? e : window.event;
if (myevent.keyCode==96)
EnableRightClick = 1;
return;
}
document.oncontextmenu = mischandler;
//document.onkeypress = keyhandler;
//document.onmousedown = mousehandler;
//document.onmouseup = mousehandler;
</script>
</BODY>
</HTML>