[英]Mouseenter Hover Div Show/Hide
I'm trying to get my function to work with no success. 我正在尝试使我的功能无法成功运行。 All I need is to be able to scroll onto my div and for the X to show up and then I can add my wanted effects afterwards. 我需要做的就是能够滚动到div上并显示X,然后再添加所需的效果。
I'm using Javascript as I need it cross browser compatible. 我正在使用Javascript,因为它需要跨浏览器兼容。 I don't want to use CSS as its very limited in what I would like to add in the future. 我不想在将来要添加的内容中使用CSS,因为它的功能非常有限。
<script>
$(document).ready(function() {
$('div.userinfo').hover({
mouseenter: function() {
$(this).children('div.delete').show();
},
mouseleave: function() {
$(this).children('div.delete').hide();
}
});
});
</script>
<?
echo "<div class='userinfo'><div class='delete' style='cursor:pointer;position:relative;top:0px;float:right;padding-right:5px;' onclick=\"delete_('".$streamitem_data['streamitem_id']."');\">X</div></div>"
Instead of .hover(), which is deprecated and doesnt work like you try to use it, use .on(): 代替.hover()(已弃用并且无法像您尝试使用它那样工作),请使用.on():
$(function() {
$('div.userinfo').on({
mouseenter: function() {
$(this).children('div.delete').show();
},
mouseleave: function() {
$(this).children('div.delete').hide();
}
});
});
This will do the job. 这样就可以了。
Use bind() method instead of hover: 使用bind()方法而不是将鼠标悬停:
$(document).ready(function() {
$('div.userinfo').bind({
mouseenter: function() {
$(this).children('div.delete').show();
},
mouseleave: function() {
$(this).children('div.delete').hide();
}
});
});
Note: If you are adding new dom elements later with jQuery, use live() or on() , if you are not, use bind method which is really solid way. 注意:如果以后要在jQuery中添加新的dom元素,请使用live()或on() ,否则请使用bind方法,这是非常可靠的方法。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.