Image Map, Rollover İmage Kullanarak Bir Site Anasayfasındaki Menu Uygulama Örneği

Resimli anlatım
Image map, rollover image kullanarak bir site anasayfasındaki menu uygulama örneği

Adobe Dreamweaver programını çalıştırıyoruz. resmimizi programa yükleyerek tag menüsünden sayfaya ortalıyoruz.

Site hazırlayabilmek için Adobe Photoshop programında ana sayfa iletişim vs  ihtiyacımıza göre butonlar hazırlıyoruz. (flash buton için aynı butonu farklı görünümlerde hazırlıyoruz.)

Image map, rollover image kullanarak bir site anasayfasındaki menu uygulama örneğiImage map, rollover image kullanarak bir site anasayfasındaki menu uygulama örneği
Image map, rollover image kullanarak bir site anasayfasındaki menu uygulama örneğiImage map, rollover image kullanarak bir site anasayfasındaki menu uygulama örneği
Image map, rollover image kullanarak bir site anasayfasındaki menu uygulama örneğiImage map, rollover image kullanarak bir site anasayfasındaki menu uygulama örneği
Image map, rollover image kullanarak bir site anasayfasındaki menu uygulama örneğiImage map, rollover image kullanarak bir site anasayfasındaki menu uygulama örneği

Adobe Dreamweaver programında alt resimde gösterilen menüden rollover image'ı tıklıyoruz.

Image Map, Rollover İmage Kullanarak Bir Site Anasayfasındaki Menu Uygulama Örneği

Flash buton hazırlayabilmek için; önceden hazırlamış olduğumuz buton resimlerini yüklüyoruz.

Original image: Orjinal resim
Rollover image: Üzerine gidilince değişecek olan resim
Go to URL: Tıklanınca gideceği url adresi

Image Map, Rollover İmage Kullanarak Bir Site Anasayfasındaki Menu Uygulama Örneği

hazırlamış olduğumuz anasayfamız.

Image Map, Rollover İmage Kullanarak Bir Site Anasayfasındaki Menu Uygulama Örneği
anasayfa butonunun üzerine gidilince almış olduğu yeni görünümü
Image Map, Rollover İmage Kullanarak Bir Site Anasayfasındaki Menu Uygulama Örneği
iletişim butonu
Image Map, Rollover İmage Kullanarak Bir Site Anasayfasındaki Menu Uygulama Örneği
biz kimiz butonu
Image Map, Rollover İmage Kullanarak Bir Site Anasayfasındaki Menu Uygulama Örneği
referans butonu
Image Map, Rollover İmage Kullanarak Bir Site Anasayfasındaki Menu Uygulama Örneği
örnek olarak anasayfa butonuna google.com'a yönlendirmiştik. diğer butonlarıda istenilen sitelere url'leri verilerek yönlendirilebilir.
Image Map, Rollover İmage Kullanarak Bir Site Anasayfasındaki Menu Uygulama Örneği

Kaynak: ali iletir 12-BT
Yorumunuzu Ekleyin


Yükleniyor...
    Yükleniyor...