Jump to content


Photo

mySQL and JavaScript Image Rollovers


  • Please log in to reply
7 replies to this topic

#1 princessdeia

princessdeia
  • New Members
  • Pip
  • Newbie
  • 2 posts

Posted 28 September 2006 - 08:48 AM

I want to create an image/text rollover on my site, similar to this.

All the data is held in a mySQL table. I can get the text part to work, but not the image part.

My code so far is,

javascript function

....
function change(html){
  DESCRIPTION.innerHTML=html
}
....

php code

....
echo "<a href=\"shop.php?c=$cat_id\" onMouseOver=\"change('$cat_description')\" onMouseOut=\"change('DESCRIPTION')\">$cat_name</a><br>";
....

html code
....
<div id="DESCRIPTION">DESCRIPTION</div>
....

Thanks in advance

Dee

#2 michaellunsford

michaellunsford
  • Members
  • PipPipPip
  • Advanced Member
  • 1,023 posts
  • LocationLouisiana, USA

Posted 29 September 2006 - 03:21 AM

I don't see any reference to an image?

#3 princessdeia

princessdeia
  • New Members
  • Pip
  • Newbie
  • 2 posts

Posted 29 September 2006 - 08:08 AM

That is what I need help with - writing the code to reference the image.
Both the array and in the html

#4 fenway

fenway
  • Staff Alumni
  • MySQL Si-Fu / PHP Resident Alien
  • 16,199 posts
  • LocationToronto, ON

Posted 29 September 2006 - 05:18 PM

What image?
Seriously... if people don't start reading this before posting, I'm going to consider not answering at all.

#5 FrOzeN

FrOzeN
  • Members
  • PipPipPip
  • Advanced Member
  • 70 posts

Posted 30 September 2006 - 01:42 PM

This works fine, check that your javascript lines of code end with semicolons appropriately.

<html>

<head>
  <title>example</title>
  script type="text/javascript">
    function change(html) {
      description.innerHTML = html;
    }
  </script>
</head>

<body>

<a href="#" onMouseOver="javascript:change('Over link one!');" onMouseOut="javascript:change('');">Link 1</a><br /> 
<a href="#" onMouseOver="javascript:change('Over link two!');" onMouseOut="javascript:change('');">Link 2</a><br />
<a href="#" onMouseOver="javascript:change('Over link three!');" onMouseOut="javascript:change('');">Link 3</a><br /><hr />

<div id="description"></div>

</body>

</html>

[EDIT] Removed dollar signs..

#6 fenway

fenway
  • Staff Alumni
  • MySQL Si-Fu / PHP Resident Alien
  • 16,199 posts
  • LocationToronto, ON

Posted 30 September 2006 - 04:00 PM

<shudder> Prefixing JS variables with dollar signs? </shudder>
Seriously... if people don't start reading this before posting, I'm going to consider not answering at all.

#7 FrOzeN

FrOzeN
  • Members
  • PipPipPip
  • Advanced Member
  • 70 posts

Posted 30 September 2006 - 05:36 PM

Wow, I'm tired. Don't know what I was thinking there. :-\

#8 michaellunsford

michaellunsford
  • Members
  • PipPipPip
  • Advanced Member
  • 1,023 posts
  • LocationLouisiana, USA

Posted 30 September 2006 - 05:41 PM

Javascript does not like newline in the middle of code. If the variable you're passing has newlines in it it just won't work.

I think it would also help us to know what's actually in that variable that's being used in the javascript.




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users