마우스 오버 질문입니다..

마우스 오버 질문입니다..

QA

마우스 오버 질문입니다..

답변 3

본문


	$(function () {
		$('.gnb_1da img').mouseover(function () {
			$(this).attr('src', this.src.replace('off', 'on'))
		}).mouseout(function () {
			$(this).attr('src', this.src.replace('on', 'off'))
		});
	});

 

이미지에 마우스 오버하면 이미지 경로 접근해서 텍스트를 변경하는건데요 ㅠ

.gnb_1da 이곳에 마우스를 올려도 자녀요소가 바뀌가할 수 있을까요? ㅠㅠ 

감이 안잡히네요 ㅠ  children 요소로 하니 this가 먹질 않네요..

이 질문에 댓글 쓰기 :

답변 3


 
$("a.gnb_1da").hover(
	//hover
	function(){
		var aa = $(this).children('img').attr('src').replace('off', 'on');
 
		$(this).children('img').attr('src', aa);
		
	},
//out
	function(){
		var bb = $(this).children('img').attr('src').replace('on', 'off');
 
		$(this).children('img').attr('src', bb);
		
	}
 
);

전 이렇게 밖에 못하겠네요. 

다른분의 쌈박한 코드를 기대하여+ㅅ+

this 대신에 자녀 요소의 클래스나 아이디를 적어주면 되지 않을까요?

적용하려는 부분 html을 보여 주세요.

소스 보기로 한 html요. 


<ul id="gnb_1dul">
				<li class="gnb_1dli">
					<a class="gnb_1da" href="">
						<img src="<?php echo G5_THEME_URL?>/img/menu0_off.png" alt="" />
					</a>
				</li>
				<li class="gnb_1dli">
					<a class="gnb_1da" href="">
						<img src="<?php echo G5_THEME_URL?>/img/menu1_off.png" alt="" />
					</a>
				</li>
				<li class="gnb_1dli">
					<a class="gnb_1da" href="">
						<img src="<?php echo G5_THEME_URL?>/img/menu2_off.png" alt="" />
					</a>
				</li>
				<li class="gnb_1dli">
					<a class="gnb_1da" href="">
						<img src="<?php echo G5_THEME_URL?>/img/menu3_off.png" alt="" />
					</a>
				</li>
				<li class="gnb_1dli">
					<a class="gnb_1da" href="">
						<img src="<?php echo G5_THEME_URL?>/img/menu4_off.png" alt="" />
					</a>
				</li>
				<li class="gnb_1dli">
					<a class="gnb_1da" href="">
						<img src="<?php echo G5_THEME_URL?>/img/menu5_off.png" alt="" />
					</a>
				</li>
				<li class="gnb_1dli">
					<a class="gnb_1da" href="">
						<img src="<?php echo G5_THEME_URL?>/img/menu6_off.png" alt="" />
					</a>
				</li>
			</ul>


이렇게 생겼습니다.

img에는 패딩값이 없어서 꼭 img위에 올려야 모양이 바뀌더라구요
a값에는 패딩이 있어서,,
그리고 마우스 오버하면 보더가 생겨야 해서 꼭 a 값에 마우스를 올려도 이미지가 바뀌었으면 합니다..

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 6
© SIRSOFT
현재 페이지 제일 처음으로