943,723 Members | Top Members by Rank

Web Development > JavaScript / DHTML / AJAX > I had problem with onmouse out in div
Ad:
Permalink
Sep 9th, 2009
0

I had problem with onmouse out in div

Expand Post »
I had problem with mouse out in div. i tried for one long day in vain. can any one do it. it was an urgent issue.Thank you in advance.
the code is
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>The test</title>
</head>
<script type="text/javascript">
function changeStyle(div)
{

document.getElementById(div).innerHTML='<a href="index.php?id=1"><img alt="Eon Beats" src="../cmsfiles/artist/3/EonBeats_web.jpg"/></a>';
}

function changeStyleBack(div)
{
//alert('no hover')
document.getElementById(div).innerHTML='<a href="index.php?id=1"><img alt="Eon Beats" src="../cmsfiles/artist/2/Michelle Martinez cropped.jpg"/></a>';
}
</script>
<!--<style type="text/css">
.home a:hover{
background-color:#000000;
background-image:none;
}
</style>-->
<body>
<table border="0" width="400" cellspacing="1" cellpadding="5" align="center">
<tr>

<td>
<div id="im_1" onmouseover="changeStyle('im_1')" onmouseout="changeStyleBack('im_1')">
<a href="index.php?id=2">
<img src='../cmsfiles/artist/2/Michelle Martinez cropped.jpg' alt='The Groove Academy'></a></div>
</td>
<td>
<div id="im_2" onmouseover="changeStyle('im_2')" onmouseout="changeStyleBack('im_2')">
<a href="index.php?id=3">
<img src='../cmsfiles/artist/3/EonBeats_web.jpg' alt='Eon Beats'></a></div>
</td>
<td>
<div id="im_3" onmouseover="changeStyle('im_3')" onmouseout="changeStyleBack('im_3')">
<a href="index.php?id=4">
<img src='../cmsfiles/artist/4/Boogaloo Anita-1.jpg' alt='Boogaloo Crew'></a></div>
</td>
<td>
<div id="im_4" onmouseover="changeStyle('im_4')" onmouseout="changeStyleBack('im_4')">

<a href="index.php?id=5">
<img src='../cmsfiles/artist/5/ReelSessions_web.jpg' alt='Reel Sessions'></a></div>
</td>
</tr>
<td>
<div id="im_5" onmouseover="changeStyle('im_5')" onmouseout="changeStyleBack('im_5')">
<a href="index.php?id=6">
<img src='../cmsfiles/artist/6/FowlPlay_web.jpg' alt='Fowl Play'></a></div>
</td>
<td>
<div id="im_6" onmouseover="changeStyle('im_6')" onmouseout="changeStyleBack('im_6')">
<a href="index.php?id=22">
<img src='../cmsfiles/artist/22/Dirty Hendrix_web.jpg' alt='Dirty Hendrix'></a></div>
</td>
<td>
<div id="im_7" onmouseover="changeStyle('im_7')" onmouseout="changeStyleBack('im_7')">

<a href="index.php?id=40">
<img src='../cmsfiles/artist/40/flatwound.jpg' alt='Flatwound'></a></div>
</td>
</tr>
</table>
</body>
</html>
Similar Threads
Reputation Points: 10
Solved Threads: 1
Newbie Poster
mvchandoo is offline Offline
10 posts
since Jun 2009
Permalink
Sep 9th, 2009
0

Re: I had problem with onmouse out in div

Can u give an explanation of what the problem is?

I have tried this, and on the onmouseover event, the innerhtml is changed. I had removed the images and just places text since i dont have the images.
Reputation Points: 36
Solved Threads: 57
Posting Whiz
Thirusha is offline Offline
355 posts
since Mar 2008
Permalink
Sep 9th, 2009
0

Re: I had problem with onmouse out in div

There might be other problems but at first glance I notice {your old code}:
html Syntax (Toggle Plain Text)
  1. <!--<style type="text/css">
  3. .home a:hover{
  4. background-color:#000000;
  5. background-image:none;
  6. }
  7. </style>-->
It looks to me like you are commenting out the style tag, telling the browser to ignore it. I think it should be {your new code}:
html Syntax (Toggle Plain Text)
  1. <style type="text/css"><!--
  2. .home a:hover{
  3. background-color:#000000;
  4. background-image:none;
  5. }
  6. --></style>

Hope that does the trick. Gotta luv how daniweb's code highlighting automatically shows where the problem is in your code by the black color
Reputation Points: 10
Solved Threads: 6
Light Poster
beeerlover is offline Offline
40 posts
since May 2009
Permalink
Sep 9th, 2009
0

Re: I had problem with onmouse out in div

Click to Expand / Collapse  Quote originally posted by mvchandoo ...
I had problem with mouse out in div. i tried for one long day in vain. can any one do it. it was an urgent issue.Thank you in advance.
the code is...
That's because you are creating a situation of infinite "mouseover" event occurrence.
Last edited by Troy III; Sep 9th, 2009 at 11:24 pm.
Reputation Points: 120
Solved Threads: 61
Posting Pro
Troy III is offline Offline
510 posts
since Jun 2008
Permalink
Sep 10th, 2009
0

Re: I had problem with onmouse out in div

Hi Thanks to all
My problem is when onmouseover the image is changing but after mouseout image have to return to its backstage. but it is not returning to backstage. the onmouseover event image is setting up.
however
I resolved the problem by setting up the onmouseover events to anchor tag.
Thankyou
Reputation Points: 10
Solved Threads: 1
Newbie Poster
mvchandoo is offline Offline
10 posts
since Jun 2009
Permalink
Sep 10th, 2009
0

Re: I had problem with onmouse out in div

Click to Expand / Collapse  Quote originally posted by mvchandoo ...
Hi Thanks to all
My problem is when onmouseover the image is changing but after mouseout image have to return to its backstage. but it is not returning to backstage. the onmouseover event image is setting up.
however
I resolved the problem by setting up the onmouseover events to anchor tag.
Thankyou
Yes that should break the recursive mouseover rising event, but what about second mouseover? That is: after the mouseout event has taken place? It will most probably die. Of course if you don't write the event handler along with the innerHTML of the element you've changed, that is.
Reputation Points: 120
Solved Threads: 61
Posting Pro
Troy III is offline Offline
510 posts
since Jun 2008

This thread is solved

Either the thread starter or a moderator has marked this thread as solved. You can most likely trust the responses and answers given. There is most likely no reason for any further responses to be posted here. If you have a related question, please start a new thread in this forum instead.

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: What technology is this at swell.com?
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: Dynamic input to to textarea


Tags
onmouseoutdivproblem



About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC