Jump to content


a "how to" on rollover buttons


7 replies to this topic

#1 meza2meza

    Young Padawan

  • Members
  • Pip
  • 9 posts

Posted 11 November 2005 - 08:44 AM

hey, imagine a very simple site, with 4 buttons, each with there own rollover gif,

how can i make it so when i click button2, the "rolled over" gif of button becomes the unrolled over (swapping the rollover with rolledover), so the user could tell what page they r on


is this done by javscript? css? even php?

any help appreciated,
mods feel free to move to different place in the forum

#2 saferwaters

    Jedi In Training

  • Members
  • PipPip
  • 390 posts

Posted 11 November 2005 - 09:36 AM

Javascript. All the help I can be, im not sure about the whole 'if im on the home page then the home image will be different' kinda question.

#3 rc69

    PHP Master PD

  • P2L Staff
  • PipPipPipPip
  • 3,827 posts
  • Gender:Male
  • Location:Here
  • Interests:Web Development

Posted 11 November 2005 - 01:24 PM

If you want the linked image to be a different color if it links to the current page, then you want to use PHP... unless you're really good with javascript.

#4 Stu

    Retired P2L Staff

  • Publishing Betazoids
  • PipPipPipPip
  • 1,761 posts
  • Gender:Male

Posted 11 November 2005 - 01:35 PM

i think he is referring to something like pixel2life has. when you are clicked on the forums page the forums button is orange, and if on the contact page the contact button will be orange and the rest green.

would it be at all possible to do it using php like so...

say you had header and footer includes and each page has a variable defined at the top of the page. for example home would have

<?$pagename = 'Home';?>

then tutorials

<?$pagename = 'Tutorials';?>

and forums

<?$pagename = 'Forums';?>

then where the naviagtion would be displayed have something like

if($pagename == 'Home'){
echo "<img src = 'home_on.gif' /><img src = 'tutorials.gif' /><img src = 'forums.gif' />
}
elseif($pagename == 'Tutorials'){
echo "<img src = 'home.gif' /><img src = 'tutorials_on.gif' /><img src = 'forums.gif' />
}
elseif($pagename == 'Forums'){
echo "<img src = 'home.gif' /><img src = 'tutorials.gif' /><img src = 'forums_on.gif' />
}

NOTE: this isnt a solution so im not sure using it would be a good idea, its a 'Would this work?' question. Im also wondering if this is illogical in any way too? as someone who doesnt know much about javascript, would this be a cleaner way to do it at all if it would work?

EDIT: just out of curiosty what is this called? ive been looking for a tutorial on this for a while. what keywords would i search for?

#5 rc69

    PHP Master PD

  • P2L Staff
  • PipPipPipPip
  • 3,827 posts
  • Gender:Male
  • Location:Here
  • Interests:Web Development

Posted 11 November 2005 - 07:09 PM

It looks like the concept of it should work, but you've got one problem. No matter what happens, the page name would be "Forums", it'd be a little easier to use $_GET['pagename'] and have the page stored in the url, then leave out the first 3 lines.

As for a name, i've got no idea what it would be called. But i can't see why it'd be much different then 90% of the templating tutorials we have here (rather then changeing the content with index.php?page=foo, you change the button, or both).

#6 Stu

    Retired P2L Staff

  • Publishing Betazoids
  • PipPipPipPip
  • 1,761 posts
  • Gender:Male

Posted 11 November 2005 - 07:16 PM

yeh cus the thing is at the moment im not using the usual templating system with index.php?page=heh, im using the include header and include footer on every page and then i have at the top of each page $pagename = example and im using that to give each page a unique title by having in my header <?echo "$pagetitle";?>

so i was just wondering if that way would work (in thoery). i might have a play around with it or something, see how it goes :D

but im nnot sure what you mean by each page name would be forums though? or do you mean if that was being used in a forum environment like pixel2life? if that is the case, for a simple portfolio site like my own (without forums) i assume it would be no problem?

#7 rc69

    PHP Master PD

  • P2L Staff
  • PipPipPipPip
  • 3,827 posts
  • Gender:Male
  • Location:Here
  • Interests:Web Development

Posted 12 November 2005 - 12:24 AM

Now that you mention it that way, it could work.
But i was under the assumtion that you put those all in the same file, one after the other.
i.e.
<?
$pagename = 'Home';
$pagename = 'Tutorials';
$pagename = 'Forums';
?>
<3

#8 Stu

    Retired P2L Staff

  • Publishing Betazoids
  • PipPipPipPip
  • 1,761 posts
  • Gender:Male

Posted 13 November 2005 - 02:33 PM

tried it out, works perfectly for me <3





1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users