Jump to content


Photo

rollover image with php and mysql


  • Please log in to reply
10 replies to this topic

#1 leon

leon
  • New Members
  • Pip
  • Newbie
  • 9 posts

Posted 09 April 2006 - 04:06 PM

Hello guys, I am new to php and mysql and i wanna use rollover images on my website. I created the codes for rollover image using dreamweaver but I can not estimate what do i need to do with mysql and php. Basically , I designed an html site using these images and tried to change the <img src> and rollover sections with the php codes but it was not useful. I hope it is clear. Can you help me?

#2 ToonMariner

ToonMariner
  • Members
  • PipPipPip
  • Advanced Member
  • 3,342 posts
  • LocationNewcastle upon Tyne, UK

Posted 09 April 2006 - 04:11 PM

use php and mysql to generate the html for the page. use javascript for any 'interaction' that you want to do - such as roll overs.

document effects are client side matters while php and mysql deals with serverside things.
follow me on twitter @PHPsycho

#3 SomeGuy1337

SomeGuy1337
  • Members
  • PipPip
  • Member
  • 14 posts

Posted 09 April 2006 - 04:30 PM

your oviously very inexpiraneced with progrmaing, which is fine, thats why your hear asking questoins.

i am not sure what you are trying to do, you need to be more clear.

i think you want it that when you press the roll over button to goto a section on your site you want php and mysql to show that content when you press the button?

you will have to be more sepcific before anyone can offer any usefull advice.

#4 Vorotaev

Vorotaev
  • Members
  • PipPip
  • Member
  • 27 posts
  • LocationCanada

Posted 09 April 2006 - 04:41 PM

[!--quoteo(post=363028:date=Apr 9 2006, 01:00 PM:name=SomeGuy1337)--][div class=\'quotetop\']QUOTE(SomeGuy1337 @ Apr 9 2006, 01:00 PM) View Post[/div][div class=\'quotemain\'][!--quotec--]
your oviously very inexpiraneced with progrmaing, which is fine, thats why your hear asking questoins.

i am not sure what you are trying to do, you need to be more clear.

i think you want it that when you press the roll over button to goto a section on your site you want php and mysql to show that content when you press the button?

you will have to be more sepcific before anyone can offer any usefull advice.
[/quote]
Technically it's scripting as opposed to programming. He wants to use a basic rollover; the image changes when you put the mouse on it. He wants to do so with PHP and MySQL, however, which isn't possible for the reasons explained by ToonMariner.

A rollover with Javascript is as simple as:

<img src="pic.jpg" onmouseover="this.src='new.jpg';" onmouseout="this.src='pic.jpg';">

[Fixed the quotes.]

#5 leon

leon
  • New Members
  • Pip
  • Newbie
  • 9 posts

Posted 09 April 2006 - 05:03 PM

[!--quoteo(post=363032:date=Apr 9 2006, 05:41 PM:name=Vorotaev)--][div class=\'quotetop\']QUOTE(Vorotaev @ Apr 9 2006, 05:41 PM) View Post[/div][div class=\'quotemain\'][!--quotec--]
Technically it's scripting as opposed to programming. He wants to use a basic rollover; the image changes when you put the mouse on it. He wants to do so with PHP and MySQL, however, which isn't possible for the reasons explained by ToonMariner.

A rollover with Javascript is as simple as:

<img src="pic.jpg" onmouseover="this.src='new.jpg';" onmouseout="this.src='pic.jpg';">

[Fixed the quotes.]
[/quote]

Thanks for your replies. Actually i want to make my site dynamic with php and mysql, But i have problems with the rollover image.here is the address;

[a href=\"http://www.ionicstone.com/tiles.htm\" target=\"_blank\"]http://www.ionicstone.com/tiles.htm[/a]

#6 kenrbnsn

kenrbnsn
  • Staff Alumni
  • Advanced Member
  • 8,235 posts
  • LocationHillsborough, NJ, USA

Posted 09 April 2006 - 05:13 PM

You can use PHP & MySql to build the javascript which is later run by the browser.

Ken

#7 Vorotaev

Vorotaev
  • Members
  • PipPip
  • Member
  • 27 posts
  • LocationCanada

Posted 09 April 2006 - 05:14 PM

OK, now I'm confused too as to what you want the rollover to do. If you want the full sized picture to appear on the left when the mouse is placed over the thumbnail, you'd use:

// The full size image.
<img id="imgfull" src="tile1_full.jpg">

// A sample thumbnail.
<img src="tile2_thumb.jpg" onmouseover="imgfull.src='tile2_full.jpg';">
...as an example.

#8 ToonMariner

ToonMariner
  • Members
  • PipPipPip
  • Advanced Member
  • 3,342 posts
  • LocationNewcastle upon Tyne, UK

Posted 09 April 2006 - 05:19 PM

Not wanting to re-invert your wheel but I am a great proponent of accessibility on websites...

Have you considered using css to do this? It means no javascript (so it doesn't matters if the visitor has js turned off) and you have an opportunity for visually imparied users to have their screen readers not have to deal with messy img tags!!!

take a look at www.regeneratingnb.co.uk and the associated css file (you will have to spend a bit of time if you are not familiar with class and id attributes and how to use them in css)
follow me on twitter @PHPsycho

#9 leon

leon
  • New Members
  • Pip
  • Newbie
  • 9 posts

Posted 09 April 2006 - 05:30 PM

[!--quoteo(post=363046:date=Apr 9 2006, 06:19 PM:name=ToonMariner)--][div class=\'quotetop\']QUOTE(ToonMariner @ Apr 9 2006, 06:19 PM) View Post[/div][div class=\'quotemain\'][!--quotec--]
Not wanting to re-invert your wheel but I am a great proponent of accessibility on websites...

Have you considered using css to do this? It means no javascript (so it doesn't matters if the visitor has js turned off) and you have an opportunity for visually imparied users to have their screen readers not have to deal with messy img tags!!!

take a look at www.regeneratingnb.co.uk and the associated css file (you will have to spend a bit of time if you are not familiar with class and id attributes and how to use them in css)
[/quote]

Thank you but, before css I need to learn php and mysql efficiently. I just thought it 'd be easier to use javascript for this because dreamweaver generates the code already, but because of my lack of knowledge, it turns into mess. I tried something like this but it doesnt help.By the way where to add script language='javascript' and </script> things while using php. ?

<img src="<?php $data['image'] ?> onmouseover=<?php $data['image_roll']; ?>> alt="<?php echo $data['alt']; ?>" width="102" height="80" ....

Wow I liked this forum, everyone tries to help, I'm impressed.Thanks guys.

#10 SomeGuy1337

SomeGuy1337
  • Members
  • PipPip
  • Member
  • 14 posts

Posted 10 April 2006 - 06:37 AM

i would strongly advise you to conquer html+css before you move onto php

javascript is interpreted by the browser just as css and html is,
php is processed by the server.
any php code is only see by teh server and not the browser, which means its also secure.
javascript it used to dynamicly control the the page after its already been loaded.

dreamweaver shud be able to make you all teh rollover code and allow you just to specifiy which images to use.

#11 leon

leon
  • New Members
  • Pip
  • Newbie
  • 9 posts

Posted 10 April 2006 - 12:39 PM

Yes, I think I will go for css rollover image. I realized that it only has a few line codes so that i can manage them efficiently. Thanks for your help. Let me search some examples for rollovers on the Net...




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users