- trigger()
마우스를 엘리먼트에 마우스오버하지 않고
어떤 버튼을 클릭했을때 마우스오버 이벤트를 발생하고 싶을 때!
<script>
$(document).ready(function(){
var box = $('#box');
box.bind({
mouseover:function(){
var tg = $(this);
tg.removeClass().addClass('over');
tg.find('> p').text('mouseover');
},
mouseout:function(){
var tg = $(this);
tg.removeClass().addClass('out');
tg.find('> p').text('mouseout');
},
click:function(){
var tg = $(this);
tg.removeClass().addClass('click');
tg.find('> p').text('click');
}
});
var nav = $('#nav');
nav.find('> .mouseover').bind('click', function(){
box.trigger('mouseover', $(this));
});
nav.find('> .mouseout').bind('click', function(){
box.trigger('mouseout', $(this));
});
nav.find('> .click').bind('click', function(){
box.click();
});
});
</script>
</head>
<body>
<div id="nav">
<input class="mouseover" type="button" value="mouseover" />
<input class="mouseout" type="button" value="mouseout" />
<input class="click" type="button" value="click" />
</div>
<div id="box" class="out">
<p>안녕!</p>
</div>
</body>