Volledige versie bekijken : Menu



nightraver
15 February 2008, 15:17
Hallo, zoals jullie in een eerdere topic van mij al gezien hebben ben ik terug een website aan het maken.
Nu wil ik een menu maken in photoshop zoals ongeveer op de volgende tutorial beschreven word klik hier (http://photoshop-tutorials.us/index.php/Photoshop%20tutorials/38-extreme-layout.html) maar ik vraag mij af hoe ik dat moet opslaan, want als ik als jpeg opsla dan is het een afbeelding maar hoe kan je dan nog op die knoppen klikken ?
Weet er hier iemand raad mee?

Jelle
15 February 2008, 17:58
Met gewone HTML kan je daarvoor image maps (http://handleidinghtml.nl/html/afbeeldingen/afbeeldingen09.html) gebruiken. Zo specificeer je aanklikbare gedeeltes binnen één afbeelding.

Een andere methode is via CSS: je maakt losse links (a tags dus) en je zet die op display:block, waardoor je ze ook een width en height kan geven. Ten slotte positioneer je ze op de juiste plaats. Het nadeel hiervan is dat je geen speciale vormen kan creëren (cirkelvormige, veelhoekige, ... aanklikbare gedeeltes) zoals met image maps wel kan.

compuchrisje
15 February 2008, 18:01
Voor zover ik al "gevorderd" ben met website building... Maak een tabel met dezelfde afmetingen als die banner. Positioneer die zoals je die wilt hebben en zet je banner (mag jpg, png, gif zijn) als achtergrond in die tabel. Als je ook die knoppen daar aanmaakt, moet je die nadien als hotspot selecteren en de link eraan toekennen naar de juiste pagina. Dit is wel iets dat in dreamweaver nogal makkelijk gaat, in puur html zal het heel anders moeten.

Edit: Jelle was me al voor, dus volg eerst dat advies maar.

Jelle
15 February 2008, 18:05
Tabellen voor design zijn not-done en zeker in dit geval met image maps gemakkelijk te vermijden :)

Met bv. Dreamweaver kan je er ook heel gemakkelijk aanmaken, gewoon rond de afbeelding klikken waar de link moet komen en hij regelt al de coördinaten voor jou.

nightraver
16 February 2008, 08:03
Euh bedankt voor de uitleg, maar net zoals chrisje bouw ik mijn site in dreamweaver, ik heb wel een basis kennis aan html maar wat jelle hier opnoemt lijkt mij niet precies eenvoudig. Ik ga het zeker en vast eens testen.
Is er mss een "eenvoudige" manier om dit te doen in dreamweaver?

grtz nightraver.

EDIT:Ok ik heb dus zelf aan het prutsen geweest en heb het gevonden in dreamweaver, het is dus niet meer als http://img117.imageshack.us/img117/63/screenshotyo0.jpg op het vierkantje of ander selectietool klikken, in de afbeelding selecteren wat je moet selecteren en link eraan koppelen. Bedankt om mij op weg te zetten jelle.