웹디자인을 하고있는 사회 초년생 입니다.ㅠ
이미지 위에 마우스를 올리면 
요런이미지가 뜨면서 기존 이미지 위에 투명하게 덮이게 하고 싶어요 ㅠㅠ(쿠팡 가격표 이미지위에 롤오버 되듯이요)
아직 가야할 길이 많은데 벌써부터 뙇뙇 막히네요 ㅠㅠ 고수님들 도와주세요 ㅠㅠ
댓글 4개
basaria
11년 전
여러가지 방법이 있는데 가장 쉬운 방법은 jquery mouseover 이벤트를 이용하는 겁니다.
구글에서 jquery mouseover 이벤트를 검색해 보세요.
구글에서 jquery mouseover 이벤트를 검색해 보세요.
11년 전
제이쿼리 mouseenter
http://search.naver.com/search.naver?where=nexearch&query=mouseenter&sm=top_sug.pre&fbm=1&acr=1&acq=mouseen&qdt=0&ie=utf8
http://search.naver.com/search.naver?where=nexearch&query=mouseenter&sm=top_sug.pre&fbm=1&acr=1&acq=mouseen&qdt=0&ie=utf8
괴테web∞
11년 전
jquery의 .hover() 메소드를 이용하는 방법도 있습니다.^^
페이지에 <script src="http://code.jquery.com/jquery-latest.min.js"></script> 를 넣어주시고요..
아래 소스를 활용해서 만들어보셔요~
<script>
$(document).ready(function(){
$('div.마우스올릴div명').hover(
function()
{
$("img.아이콘이미지클래스명").show();
},
function()
{
$("img.아이콘이미지클래스명").hide();
});
});
</script>
http://sir.co.kr/bbs/board.php?bo_table=pg_tip&wr_id=10977&sca=&sfl=wr_subject%7C%7Cwr_content&stx=hover
여기에도 소스가 있네요..
페이지에 <script src="http://code.jquery.com/jquery-latest.min.js"></script> 를 넣어주시고요..
아래 소스를 활용해서 만들어보셔요~
<script>
$(document).ready(function(){
$('div.마우스올릴div명').hover(
function()
{
$("img.아이콘이미지클래스명").show();
},
function()
{
$("img.아이콘이미지클래스명").hide();
});
});
</script>
http://sir.co.kr/bbs/board.php?bo_table=pg_tip&wr_id=10977&sca=&sfl=wr_subject%7C%7Cwr_content&stx=hover
여기에도 소스가 있네요..
11년 전
발코딩 한번 해봤습니다. 돌아갈진 모르겠네요.
$(function(){
var $overimg = $("<img>").addClass('over').attr('src','http://kinimage.naver.net/20140924_232/1411549767211aizkB_PNG/over.png').css('opacity',0.5);
var $target = $("#main_logo").parent();
$target.hover(
function(){
var t_w = $target.find("img").width();
var t_h = $target.find("img").height();
$overimg.css({
'height':t_h,
'width':t_w
})
$target.append($overimg)
}
,function(){
$(".over").remove();
}
)
})
$(function(){
var $overimg = $("<img>").addClass('over').attr('src','http://kinimage.naver.net/20140924_232/1411549767211aizkB_PNG/over.png').css('opacity',0.5);
var $target = $("#main_logo").parent();
$target.hover(
function(){
var t_w = $target.find("img").width();
var t_h = $target.find("img").height();
$overimg.css({
'height':t_h,
'width':t_w
})
$target.append($overimg)
}
,function(){
$(".over").remove();
}
)
})
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 6630 |
차가운바람
|
12년 전 | 1159 | |
| 6629 | 12년 전 | 1155 | ||
| 6628 |
put777
|
12년 전 | 640 | |
| 6627 |
 HackYa |
12년 전 | 694 | |
| 6626 | 12년 전 | 1616 | ||
| 6625 |
 Terrorboy |
12년 전 | 715 | |
| 6624 |
미켈란젤로의왼손
|
12년 전 | 477 | |
| 6623 |
Terrorboy |
12년 전 | 1040 | |
| 6622 | 12년 전 | 1375 | ||
| 6621 |
차가운바람
|
12년 전 | 628 | |
| 6620 | 12년 전 | 730 | ||
| 6619 |
Terrorboy |
12년 전 | 964 | |
| 6618 | 12년 전 | 1741 | ||
| 6617 | 12년 전 | 637 | ||
| 6616 |
차가운바람
|
12년 전 | 887 | |
| 6615 | 12년 전 | 2853 | ||
| 6614 | 12년 전 | 613 | ||
| 6613 |
강명구베드로
|
12년 전 | 526 | |
| 6612 |
 BlueAngel |
12년 전 | 424 | |
| 6611 | 12년 전 | 1202 | ||
| 6610 | 12년 전 | 1019 | ||
| 6609 | 12년 전 | 3678 | ||
| 6608 |
HackYa |
12년 전 | 828 | |
| 6607 | 12년 전 | 690 | ||
| 6606 | 12년 전 | 565 | ||
| 6605 | 12년 전 | 450 | ||
| 6604 | 12년 전 | 969 | ||
| 6603 |
geektoo
|
12년 전 | 690 | |
| 6602 | 12년 전 | 834 | ||
| 6601 | 12년 전 | 358 | ||
| 6600 | 12년 전 | 400 | ||
| 6599 | 12년 전 | 536 | ||
| 6598 | 12년 전 | 935 | ||
| 6597 | 12년 전 | 928 | ||
| 6596 | 12년 전 | 409 | ||
| 6595 | 12년 전 | 781 | ||
| 6594 | 12년 전 | 4574 | ||
| 6593 | 12년 전 | 2578 | ||
| 6592 | 12년 전 | 826 | ||
| 6591 | 12년 전 | 581 | ||
| 6590 |
HackYa |
12년 전 | 1386 | |
| 6589 | 12년 전 | 758 | ||
| 6588 |
GINUSSOFT
|
12년 전 | 5125 | |
| 6587 | 12년 전 | 6208 | ||
| 6586 | 12년 전 | 1042 | ||
| 6585 | 12년 전 | 802 | ||
| 6584 | 12년 전 | 453 | ||
| 6583 |
HackYa |
12년 전 | 982 | |
| 6582 | 12년 전 | 866 | ||
| 6581 | 12년 전 | 839 | ||
| 6580 | 12년 전 | 615 | ||
| 6579 |
알랑가몰라
|
12년 전 | 919 | |
| 6578 | 12년 전 | 1326 | ||
| 6577 | 12년 전 | 1497 | ||
| 6576 |
경dragon
|
12년 전 | 764 | |
| 6575 | 12년 전 | 1877 | ||
| 6574 | 12년 전 | 678 | ||
| 6573 | 12년 전 | 975 | ||
| 6572 |
 jakekwak |
12년 전 | 1659 | |
| 6571 |
CTOMAN
|
12년 전 | 1953 | |
| 6570 | 12년 전 | 1725 | ||
| 6569 | 12년 전 | 1883 | ||
| 6568 | 12년 전 | 2401 | ||
| 6567 | 12년 전 | 1025 | ||
| 6566 |
lainfox
|
12년 전 | 1525 | |
| 6565 | 12년 전 | 3653 | ||
| 6564 |
제주프라이스
|
12년 전 | 1531 | |
| 6563 | 12년 전 | 1574 | ||
| 6562 |
프로프리랜서
|
12년 전 | 1344 | |
| 6561 |
프로프리랜서
|
12년 전 | 964 | |
| 6560 |
프로프리랜서
|
12년 전 | 1216 | |
| 6559 |
프로프리랜서
|
12년 전 | 1133 | |
| 6558 |
프로프리랜서
|
12년 전 | 1349 | |
| 6557 |
프로프리랜서
|
12년 전 | 1969 | |
| 6556 |
프로프리랜서
|
12년 전 | 1519 | |
| 6555 |
프로프리랜서
|
12년 전 | 1358 | |
| 6554 |
프로프리랜서
|
12년 전 | 3886 | |
| 6553 |
프로프리랜서
|
12년 전 | 1505 | |
| 6552 | 12년 전 | 841 | ||
| 6551 |
왕초보sasa
|
12년 전 | 1534 | |
| 6550 |
왕초보sasa
|
12년 전 | 628 | |
| 6549 |
왕초보sasa
|
12년 전 | 901 | |
| 6548 | 12년 전 | 1300 | ||
| 6547 | 12년 전 | 1187 | ||
| 6546 | 12년 전 | 5156 | ||
| 6545 | 12년 전 | 2514 | ||
| 6544 |
AnnieK
|
12년 전 | 1776 | |
| 6543 |
베르무트7
|
12년 전 | 624 | |
| 6542 |
오늘도망했다
|
12년 전 | 2232 | |
| 6541 | 12년 전 | 818 | ||
| 6540 | 12년 전 | 1130 | ||
| 6539 | 12년 전 | 846 | ||
| 6538 |
senseme
|
12년 전 | 3368 | |
| 6537 | 12년 전 | 777 | ||
| 6536 | 12년 전 | 3665 | ||
| 6535 | 12년 전 | 1345 | ||
| 6534 | 12년 전 | 1623 | ||
| 6533 | 12년 전 | 2242 | ||
| 6532 |
냐옹이사범
|
12년 전 | 2305 | |
| 6531 | 12년 전 | 565 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기