开发者

jQuery li hover complete code

开发者 https://www.devze.com 2023-01-15 04:34 出处:网络
<ul id=\'ulid\'> <li>Task1</li> <li>Task2</li> <li>Task3</li> <li>Task4</li>
<ul id='ulid'>
<li>Task1</li>
<li>Task2</li>
<li>Task3</li>
<li>Task4</li>
<li>Task5</li>
<li>Task6</li>
<li>Task7</li>
</ul>
<div id="show_details"></div>

I would like开发者_如何学Go what's the JavaScript that I can use to copy the details of the li into the div on mouseover hide it on mouseout.


This will work for a particular ul:

jQuery(document).ready(function(){

 $('ul#ulid li').hover(function() {
    $('#show_details').html( $(this).text() );
  }, function() {
    $('#show_details').html( '' );
 });

});

Demo


If you mean the "content" with "details", you might want to try:

var $details = $('#show_details');
$('ul > li').hover(function(){
   $details.text($(this).text());
}, function(){
   $details.text('');
});

Ref.: .hover()


Ref : jQuery.hover() , jQuery.html() , jQuery.empty()

$(function() {
 $('li').hover(function() {
    $('#show_details').html( $(this).text() );
  }, function() {
    $('#show_details').empty()
 });
});
0

精彩评论

暂无评论...
验证码 换一张
取 消