2009-11-06 3 views
0

사용자가 미리보기 이미지를 클릭하는 이미지 갤러리를 제어하는 ​​페이지 헤드 부분에 자바 스크립트가 있습니다. 이미지와 더 큰 이미지 및 일부 텍스트가 스팬에 표시됩니다. 1 페이지 당 10 개의 미리보기 이미지가 있으며 첫 번째 미리보기 이미지의 숨겨진 범위를 페이지로드시 "차단"하도록 설정하는 방법을 찾아야합니다. 표시 할 1 스팬의 스타일을 설정해야합니다. 스팬의 표시하도록 설정된 이미지 갤러리의 페이지로드시 블록 : 없음


이 어떤 도움은 매우 감사
<script type="text/javascript"> 
function hideSpan(spanName) { 

var obj = document.getElementById(spanName); 
obj.style.border="0px"; 
obj.style.color="#fff"; 
obj.style.display="none"; 
obj.style.left="333px"; 
obj.style.padding="0"; 
obj.style.position="absolute"; 
obj.style.top="55px"; 
obj.style.width="244px"; 
} 

function showSpan(spanName) { 

var spanEl, count = 1; 
while(spanEl = document.getElementById('link' + count++)){ 
spanEl.style.display = 'none'; 
} 

var obj = document.getElementById(spanName); 
obj.style.display="block"; 
} 

</script> 

당신을 감사합니다.

+0

안녕하세요. 첫 번째 질문과 같이 코드를 게시하는 법을 배워 주셔서 감사합니다. 슈퍼 예이! 그러나 질문 제목 형식을 살펴보면 "페이지를로드 한 후 요소에 표시 : 블록을 어떻게 설정합니까?" 여기 사용자가 많으면 형식이 잘못된 질문을 건너 뛰고 계속 진행하는 것이 중요합니다. 어쨌든, 재미있게 즐기십시오! 팁을 주신 덕분에 –

+0

! 이것은 내가 프로그래밍을 한 첫 해이고 stackoverflow는 여러 번 나를 도왔다. 나는 단지 몇 가지 질문을 올렸지 만 나는 항상 다른 사람들의 답변을 읽는다. 나는 이제부터 내 질문에 대해 올바르게 질문 할 것이다. 고맙습니다. – dfogge

답변

1

간단한, 시원한 방법은이 작업을 수행하는 것입니다

<body onload="showSpan('link1');"> 

여기서 문제는 몸에 부착 된 onload 이벤트가 그런 식으로 모든 파트로 나뉘는데, 후 (늦게 페이지 로딩에 조금 실행되는 것입니다 이미지 포함)가로드되므로 사용자가 전화를 걸 때 살해 당할 수 있습니다. jQuery를 훨씬 더 좋은 방법이 구현 : 여기 다음, 나는 더 이상 가능성이 "적절한"자바 스크립트를 사용하여 할 수있는 올바른 방법을 알고있는 것보다 훨씬 현명한 사람을 jQuery를 사용하지 않는 경우

$(document).ready(function() { 
    showSpan('link1'); 
}); 

을 기억하지 않습니다 jQuery가 내 머리 꼭대기에서 사용하는 이벤트 이름.

+0

페이지가로드 된 후 JS에서 그렇게하는 것이 중요하지 않은 경우 순수한 CSS 솔루션을 사용하지 않는 이유는 무엇입니까? 축소판에 대해 "display : hidden"을 정의한 다음 "img.thumbnail : first-child {display : block;}"이렇게하면 첫 번째 자식 선택기가 컨테이너의 첫 번째 요소에만 적용되고, 그래서 연속으로 많은 이미지가 있다면 첫 번째 이미지에만 영향을 미칩니다. 마크 업 설정 방법에 따라 매우 유용합니다. –

+0

대단히 감사합니다. 나는 그저 효과가 있었기 때문에 지금 당장 시원한 길을 갔다. 내가 jquery 쉽게 시간이있을 때 구현할 수있을 것이라고 생각 그래서 나는 WordPress를 사용하고 있습니다. 마감일은 오늘이므로 내 생명이 구해졌습니다. 다시 한 번 감사드립니다! – dfogge

관련 문제