onmouseover | 易学教程

How can I show a div only when hovering a menu item or the div?

阅读更多关于 How can I show a div only when hovering a menu item or the div?

I have items contained in an unordered list. I have hidden divs (using display:none;) outside of this list. When you hover over a list item, I would like the div to appear. It must also remain visible if you move your mouse from the list item to the div below it. I am open to accomplish this through CSS, JavaScript/jQuery. Also, my document is set to HTML5. This is what I am currently working with. <nav id="main-menu"> <ul> <li><a class="first-link parent" href="">First Link</a></li> <li><a class="second-link parent" href="">Second Link</a></li> <li><a class="third-link parent" href="">Third

How can I show a div only when hovering a menu item or the div?

阅读更多关于 How can I show a div only when hovering a menu item or the div?

问题 I have items contained in an unordered list. I have hidden divs (using display:none;) outside of this list. When you hover over a list item, I would like the div to appear. It must also remain visible if you move your mouse from the list item to the div below it. I am open to accomplish this through CSS, JavaScript/jQuery. Also, my document is set to HTML5. This is what I am currently working with. <nav id="main-menu"> <ul> <li><a class="first-link parent" href="">First Link</a></li> <li><a

Javascript onmouseover and onmouseout

阅读更多关于 Javascript onmouseover and onmouseout

You can see in the headline what it is. I've four "div", and therein are each a p tag. When I go with the mouse on the first div, changes the "opacity" of the p tag of the first div. The problem is when I go on with the mouse on the second or third "div" only changes the tag "p" from the first "div". It should changes the their own "p" tags. And it is important, that i cannot use CSS ":hover". The problem is clear, it is that all have the same "id". I need a javascript which does not individually enumerated all the different classes. I' sorry for my english. I hope you understand me. My script

Add onclick and onmouseover to canvas element

阅读更多关于 Add onclick and onmouseover to canvas element

I want to add an onclick , onmouseover and an onmouseout events to individual shapes in a canvas element. I have tried doing this with SVG in different ways and found no single method will work in all the major browsers. Maybe, is there a simple way to add an onclick and probably other events to canvas shapes? Can someone please show me how to add an onclick ? Here is my code: canvas { background:gainsboro; border:10px ridge green; } <canvas id="Canvas1"></canvas> var c=document.getElementById("Canvas1"); var ctx=c.getContext("2d"); ctx.fillStyle="blue"; ctx.fillRect(10,10,60,60); var ctx=c

Collision between two elements with rotating

阅读更多关于 Collision between two elements with rotating

问题 var keys = new Array(); var direction; var direction; var iNr = 0; $(document).ready(function(){ looper(); $("#demo1").css("margin-top", 400 + "px"); $("#demo2").css("margin-left", 380 + "px"); myFunction(); }); function myFunction() { iNr = iNr + 0.5; $("#main").css("transition","all 0.1s"); $("#main").css("transform","rotate(" + iNr + "deg)"); setTimeout(function() { myFunction(); }, 50); } function looper() { var p =$("#circle"); var offset = p.offset(); var t =$(".red"); var roffset = t

Add onclick and onmouseover to canvas element

阅读更多关于 Add onclick and onmouseover to canvas element

问题 I want to add an onclick , onmouseover and an onmouseout events to individual shapes in a canvas element. I have tried doing this with SVG in different ways and found no single method will work in all the major browsers. Maybe, is there a simple way to add an onclick and probably other events to canvas shapes? Can someone please show me how to add an onclick ? Here is my code: canvas { background:gainsboro; border:10px ridge green; } <canvas id="Canvas1"></canvas> var c=document

Mouse hover canvas/shape

阅读更多关于 Mouse hover canvas/shape

I have this code on in Jquery. I would like to change the opacity percentage of the individual shapes on mouseover. I normaly don't have this kind of problems, but I don't know a lot about canvas... Any help/advice would be appreciate! Thanks in advance! var canvas = document.getElementById('canvas'); if (canvas.getContext) { var ctx = canvas.getContext('2d'); ctx.canvas.addEventListener('mousemove', function(event){ var mouseX = event.clientX; var mouseY = event.clientY; var status = document.getElementById('status'); status.innerHTML = mouseX + " | " + mouseY; }); ctx.beginPath(); ctx.moveTo

Get pixelcolor of CSS Background Image

阅读更多关于 Get pixelcolor of CSS Background Image

I need to get the color of any pixel my mousepointer is currently hovering. I found several solutions for canvas elements, but none for a background image defined in CSS for a element. How can I achieve this? jwatts1980 Combining the answers from Get a CSS value with JavaScript and How to get a pixel's x,y coordinate color from an image? , I was able to simulate what you are looking for: JSFiddle <html> <head> <style type="text/css"> #test { background-image: url('http://jsfiddle.net/img/logo.png'); background-color: blue; background-repeat: no-repeat; height: 30px; width: 100%; } #hidden {

Javascript: enable/disable button with mouseover/mouseout

阅读更多关于 Javascript: enable/disable button with mouseover/mouseout

This should be pretty straightforward: <input type="button" name="test" id="test" value="roll over me" onmouseover="this.disabled=true;" onmouseout="this.disabled=false;"> If I place the mouse cursor over this button, it gets disabled..yay! But now when I move the cursor out, it doesn't get enabled...boo. I understand the concept of disabling it means you can't do anything with it. But how do you get it to be enabled with a mouse out? Is it possible? Am I missing something? You should set the mouseout to disabled = '' instead. <input type="button" name="test" id="test" value="roll over me"

Collision between two elements with rotating

阅读更多关于 Collision between two elements with rotating