jquery-hover

问题 I need to create a website with this kind of function: I have an image (like a park area), so in different points of this image I must create a div which will do a hover effect and show a textbox with an image (or maybe a link to it). My main doubt is that I have no idea how can I get certain points of this image to create a div with this hover effect. 回答1: Please check the below URL's. Hope this may helpful http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_areamap http://www

问题 I am trying to understand them but seems like I cannot. So I thought if someone can help me to better understand how these works. When I add hover state it simply do opacity effect whether mouse is on the element or when mouse leaves element... It repeats it... And mouseenter&leave works fine but I don't know how to tell him once $(this) so I made something and it works but perhaps someone may tell me what is correct and better way. $("nav.topMenu-left li, nav.topMenu-right li").on(

问题 Please see the code below (very stripped back and not my full function). I've also got a fiddle that you can test it at: https://jsfiddle.net/glenn2223/uk7e7rwe/1/ var hov = $("<div class=\"over\">I'm Over You</div>"), box = $("<div>Result: WAITING</div>") $("body").append(hov).append(box); $("#MeHover").on('mouseleave', function(){ var d = new Date(); box.text("Result: " + hov.is(":hover").toString().toUpperCase() ); }); We have a div and div.over overlaps it slightly. When you move from div

问题 I have set up a very simple jQuery hover function, but the thing is when you hover over the trigger div, it works but if you move your mouse over the targeted div whilst still on the trigger div (the overlap) it flickers!? Any ideas? I have this jQuery code: $("#tag").hover( function () { $("#homeHover").show(); }, function () { $("#homeHover").hide(); } ); With this HTML structure: <div id="homeHover"></div> <div id="tag"> </div> And this CSS: #homeHover { width: 150px; height: 150px;

问题 I have a question about using velocity.js for hovering on elements. Currently I use CSS to zoom in/out and animate elements when users hover on them, and I use velocity.js to animate them initially on page load. So my question is; how should I be using velocity.js to replace these CSS animations/should I at all? Currently I use velocity on page load as I'm sure that's what it was designed for, but was it also intended for use with things like hover? With jQuery I'm guessing this is how a

问题 I am trying to stop a .hover action whenever a div changes height. This is the code I have so far: if (secondary.height() <= 300) { secondary.css("height",300); secondary.hover(function(){ jQuery('.comments-holder').css("height",mediumHeight); }, function(){ jQuery('.comments-holder').css("height",minHeight); }); } else { // DO SOMETHING ELSE } The problem I am having is that .hover is being triggered no matter what the if statement implies. 回答1: Check for the height inside the hover function

问题 the question might be a bit wired but in other words i have a menu (see jsfiddle) when i hover over a div i get a drop down. when i mouseleave the drop down disappear. so far so good. the problem is that i want the menu to stay open if the mouse is hovering over the drop down also. ex: if($elem).not(":hover"){..} some code: <div class="top_menu_item"> <div class="hover_item"> <a href="#">TEST</a> </div> <div class="drop_item" style="display: none;"> <div> <a href="#">My test</a> </div> <div

问题 I have this image on html/php page dimensions 500x500 pixels. Now I want that its portions are sliced and when user bring his mouse over the image at different portions of image different message shall be displayed.. Lets say that image is sliced in 20 parts or I pick up starting and ending coordinates for each slice.. How can I make some sore of js code so that on same image there are different areas where different messages (tooltip) are displayed.. Guys any help?? I thought of programming

问题 I have a list of images showing and each image got a list of 1 or more additional thumbnail images. When use hovers on one of the additonal images, the main image has to change with that addional image's source, and when mouse leaves that thumbnail, the original main image source comes back. I managed to make it work but it only updates the source with the last thumnbail in found in the loop, so I'm basically stuck here is my code which is not working at the moment <div> <img class="mainImg"

问题 I am having some trouble in trying to add an active state to my links. This the code I am playing with: $(function () { $('a').click(function () { $(this).addClass('PnavCurrent'); //$("div a").removeClass("PnavCurrent"); //$("div a[href="+newHash+"]").addClass("PnavCurrent"); $(this).removeClass('PnavCurrent'); $(this).css('color', '#51ad9d'); $(this).css('z-index', '2'); $(this).css('border-color', '#00a8ff'); $('a').hover($(this).css('z-index', '10')); }); }); For some reason it won't apply