Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

button-indruk-effect

5 antwoorden
  • Voor een demo van een touchscreen heb ik een button (<input type = "button"> nodig met een "indruk-effect". In CSS heb ik de borders van de button gedefinieerd. Dat indruk-effect gaat in IE goed, maar in Firefox (en die wil ik nu juist voor de demo gebruiken) niet. Weet iemand hoe ik het voor elkaar kan krijgen dat het ook in Mozilla/Firefox werkt? bvd.
  • Code? - Bas
  • Ik heb dit met Javascript een keer gemaakt, werkt perfect. Hier is de code, moet je wel zelf ff een paar dingen aanpassen [code:1:030fe72aca]<script type="text/javascript"> <!-- if (document.images) { image1 = new Image; image2 = new Image; image3 = new Image; image4 = new Image; image1.src = "aanmeldenuit.jpg"; image2.src = "aanmeldenin.jpg"; image3.src = "bekijkenuit.jpg"; image4.src = "bekijkenin.jpg"; } function chgImg(name, image) { if (document.images) { document[name].src = eval(image+".src"); } } // --> </script> [/code:1:030fe72aca][code:1:030fe72aca]<p><a href="mailto:xxxx@xxxx.nl" onMouseDown='chgImg("enter", "image2")' onMouseUp='chgImg("enter", "image1")' onMouseOut='chgImg("enter", "image1")'> <img name="enter" src="aanmeldenuit.jpg" border="0" alt="Meld nieuws aan..."></a></p> [/code:1:030fe72aca]
  • Met CSS alleen kan het ook prima, dus er zal ergens een klein foutje zitten... Dit kan ik echter niet zien zonder relevante code. - Bas
  • De relevante code:[code:1:08329a9ec7]<?php echo(" <html> <head> <title>Menu</title> <link rel='stylesheet' type='text/css' href='styles1.css'> </head> <body> <div id='bg-palm'></div> <div id ='orientatie'> hoofd-menu </div> <input type='button' value='reserveren' class='menuButtonR' onClick=\"document.location = 'res1.php';\"> <div id='navigatie'> <input type='button' value='<' class='buttonBack'onClick=\"document.location = 'index.php';\"> </div> </body> </html> "); ?> [/code:1:08329a9ec7] En de css:[code:1:08329a9ec7]#bg-palm{ position:absolute; left:10px; top:10px; background-image: url(palm2.jpg);width:347px;height:558px;color:white; } #orientatie{ position:absolute; left:50px; top:97px; color:white; font-family: Arial, Helvetica, Sans-Serif; font-size:14px; background-color :#00749f; width:265px; height:25px; text-align:center; padding-top:10px; } #navigatie{ position:absolute; left:51px; top:370px; background-color :#00749f; width:264px; height:30px; padding-top:10px; } .menuButtonR { position:absolute; top:160px; left:65; background-color:#0099CC; width:230px; height:30px; font-size:20px; color:white; font-family:arial; text-align:center; padding-top:0px; border-style : outset; border-color : White; border-width : 2px; } .buttonBack{ position:absolute; top:6px; left:30; background-color:#0099CC; width:26px; height:26px; font-size:20px; color:white; font-family:arial; text-align:center; padding-top:0px; padding-left:0px; border-style : outset; border-color : White; border-width : 2px; } [/code:1:08329a9ec7]

Beantwoord deze vraag

Weet jij het antwoord op deze vraag? Registreer of meld je aan met je account

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.