[英]jQuery: Create link on mouseover/hover
I have the following HTML code. 我有以下HTML代码。 How can create a link on the entire div which when people click on it would take them to a specific link?
如何在整个div上创建链接,当人们单击该链接时,该链接会将他们带到特定链接? basically an
"<a></a>"
tag on the entire DIV 基本上是整个DIV上的
"<a></a>"
标签
<div class="unique">
<div>
<p>Lines of text</p>
<p>Extra lines of text</p>
</div>
</div>
here is my jQuery script i have come up with, i just have no idea how to make the link in it 这是我想出的jQuery脚本,我只是不知道如何在其中创建链接
<script>
$( ".unique" ).mouseover(function() {
$(this).LINK_TO_A_SPECIFIC_URL;
});
</script>
I know this is not quite what you asked for. 我知道这不是您所要求的。 But, @undefined made a good point in his comment to your post.
但是,@ undefined在他对您的帖子的评论中提出了一个很好的观点。
So instead of just auto forwarding to another page on a mouseover why not (if it's not clear to the user) advise that clicking will take them somewhere else. 因此,为什么不(如果用户不清楚)不建议在鼠标悬停时自动转发到另一个页面,建议单击会将它们带到其他位置。 That's just nicer.
那就更好了。
Your markup: 您的标记:
<div class="unique">
<div>
<p>Lines of text</p>
<p>Extra lines of text</p>
</div>
</div>
jQuery: jQuery的:
var fetchContent = $('.unique').html();
$(document).ready(function(){
$('.unique').on('mouseenter',function(){
$(this).html('Click here and we\'ll go somewhere else!');
});
$('.unique').on('mouseleave',function(){
$(this).html(fetchContent);
});
$('.unique').on('click',function(){
location.href='go-to-your-url';
});
});
Here's a fiddle: http://jsfiddle.net/6b8ku/1/ 这是一个小提琴: http : //jsfiddle.net/6b8ku/1/
How about this: 这个怎么样:
<script>
$( ".unique" ).click(function() {
window.location = LINK_TO_A_SPECIFIC_URL;
});
</script>
You can change the mouse icon, when mouse over the div : 将鼠标悬停在div上时,您可以更改鼠标图标:
<script>
$( ".unique" ).mouseover(function() {
$(this).css( 'cursor', 'pointer' );
});
</script>
here is the JSFiddle: http://jsfiddle.net/9zyeX/ 这是JSFiddle: http : //jsfiddle.net/9zyeX/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.