Jump to content

Onclick Stop Menu Image


Piticu

Recommended Posts

im not sure what you mean. the hover will happen before someone clicks so...do you just not want the hover at all?

Link to comment
Share on other sites

ok, so on that other page when you click on contact the image stays in its 'on' mode.Well, to be perfectly honest, I would just use CSS for rollovers and hover effects.http://www.w3schools.com/css/css_pseudo_classes.aspoh, you only need one DTD on your page. Take one out and get in the habit of validating your work as you go along.http://validator.w3.org/

Link to comment
Share on other sites

i want to make identical....when you click on the menu to stay in 'on' mode but i don't know how to do it
right...so did you look at the CSS guide on pseudo classes that I provided for you? there's really no reason why you would have to use javascript for this, either way you need to have two versions of your image.
Link to comment
Share on other sites

The Problem with active: pseudo class, is that it does not work in all browsers.Let me get this right!hover over button, button changes to hover state image. - right!, i get thatwhen you click specific button, which is still in hover state, you go to that specific page. - Yeswhen in selected page, make the button related to current page still remain in hover state. Yes!what you have to do is use a class that references the hover state image, within that current page link.example:(current page: http://piticu.byethost14.com/skola/?page=informatika)<a class="active" href="?page=informatika">Co je informatika?</a>then change #menu a:active{background:url('hover9.jpg');color:white;}TO:#menu a.active{background:url('hover9.jpg');color:white;}

Link to comment
Share on other sites

just realized you are inserting page within page. anyway" you will have to use the GET values to assign the class to anchor using javascript.<?php$active = $_REQUEST['page'];?><script type="text/javascript">var pageref = <?php echo $active; ?>;function updateactivemenu(){var menu = document.getElementById("menu");var menulinks = menu.getElementsByTagName("a");for(i=0;i=menulinks.length;i++){if(menulinks.href=="'?page="+pageref+"'"){menulinks.setAttributes("class", "active") //other browsersmenulinks.setAttributes("className", "active") //IE}}}window.onload=updateactivemenu;</script>

Link to comment
Share on other sites

without javascript<!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><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><script type="text/javascript">/*<![CDATA[*//*---->*//*--*//*]]>*/</script> <style type="text/css"></style></head><body><?phpif (isset($_REQUEST['page'])){$active = $_REQUEST['page'];}else{$active="home";}$linkref=array('home','boo1','informatika','programator','proc','misto','skym','fotky');$linktext=array('Hlavní stránka','Historie','Co je informatika?','Co znamena Programátor?','Proč informatika?','Místo kde se pracuje','S kým/s čým se pracuje?','Fotky informatika');?><ul><?phpfor($i=0;$i<count($linkref);$i++){if($linkref[$i]==$active){echo ("<li><a class=\"active\" href=\"?page=".$linkref[$i]."\">".$linktext[$i]."</a></li>\n");}else{echo ("<li><a href=\"?page=".$linkref[$i]."\">".$linktext[$i]."</a></li>\n");}}?></ul></body></html>

Link to comment
Share on other sites

why don't you just write the code so that the image src (on its 'active' page) is something like<img src="image_on.jpg">As far as your implementation of :active not working, I would image it was just a poor implementation of the pseudo-class.

Link to comment
Share on other sites

because i have this code in INDEX <?php if(isset($_GET['page']) && ctype_alnum($_GET['page'])){include($_GET['page'].".php");}else{include("home.php");} ?> and i mustn't write every time the index code:).....maybe it's somehow owrking and i don't know how...i'm not very good...i started to learn now 3 months ago...so i'm a little learner:))

Link to comment
Share on other sites

theres nothing wrong with running your code everytime the page is called, that what you have to do to pass and read the URL variables, from the menu buttons.this is a rough guide, on a page you require, based on your design.<!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" lang="en" xml:lang="en"><head><?phpif (isset($_GET['page']) && ctype_alnum($_GET['page'])){$active = $_GET['page'];}else{$active="home";}$linkref=array('home','boo1','informatika','programator','proc','misto','skym','fotky');$linktext=array('Hlavní stránka','Historie','Co je informatika?','Co znamena Programátor?','Proč informatika?','Místo kde se pracuje','S kým/s čým se pracuje?','Fotky informatika');?><meta http-equiv="content-type" content="text/html;charset=utf-8" /><meta name="generator" content="Piticu" /><meta name="keywords" content="informatika,fotky,historie" /><meta name="description" content="To je prezentace o informatice" /><title>VITEJTE!!!</title><link rel="stylesheet" type="text/css" href="design.css" /><link rel="stylesheet" type="text/css" href="home.css" /></head><body><!--Header--><div id="header" align="center"><img src="images/informatica.jpg" width="1007" height="230" alt="informatica" align="middle" /><h1>♣ ♦ ♦Vitejte!!!!!!♦ ♦ ♣</h1></div><!--End of Header--><!--Left side panel--><div id="menu" align="left" style="float:left; width:235px;"><?phpfor($i=0;$i<count($linkref);$i++){if($linkref[$i]==$active){echo ("<li><a class=\"active\" href=\"?page=".$linkref[$i]."\">".$linktext[$i]."</a></li>\n");}else{echo ("<li><a href=\"?page=".$linkref[$i]."\">".$linktext[$i]."</a></li>\n");}}?></div><!--End of Left side panel--><!--Main Body Container--><div style="margin-left: 245px;"><?phpinclude($active.".php"); ?></div><!--End of Main Body Container--></body></html>

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...