Free Web Hosting Provider - Web Hosting - E-commerce - High Speed Internet - Free Web Page
Search the Web

WEB TASARIMCILIĞI 8
WEB TASARIMCILIĞI 8 Hover Buton

 

        Hover Buton Eklemek

Sayfamıza mouse üzerine geldiği zaman değişim gösteren işlem düğmeleri (buton) ekle mek için Insert menüsünden Component menü seçeneğinden Hover Buton alt menü seçeneği kliklenir. Bu işlemi yapmadan önce nereye eklemek istiyorsak mouse ile sayfa nın o noktasını kliklemeyi unutmayınız.

Button text butonun üzerinde bulunacak yazıyı tanımlamaya yarar. Mouse ile bilgi giriş kutusu kliklenerek bu bilgi girilir. Bu yazının font özelliklerini belirlemek için Font butonu kliklenir ve özellikler seçilerek OK butonu kliklenir.
Link To başlığı olan bilgi giriş kutusu kliklenerek //PCAdı/WebSitesiAdı/SayfAdı.htm ile bu butona basılınca nereye geçileceği belirtilir. Böylece buton ile sayfa arasında bir link kurulmuş olur. Bu işlem yanındaki Browse butonu kliklenerek de yapılabilir.
Button Color butonun normal rengini belirtmeye yarar. Açılır liste kutusu kliklenerek renk belirtilir.
Background Color  ile butonun arka alanının rengi belirlenir. Bu renk sayfa renginin aynısı olsa iyi olur.
Effect mouse üzerine geldiği zaman ne gibi davranış ortaya koyacak o belirtilir. Effect color'ı da belirledikten hemen sonra Preview penceresinde her efekti keşfetmek zevkli olacaktır.
Effect Color  mouse üzerine geldiği zaman butonun alacağı rengi belirtmek için kullanılır.
Witdh  ile buton genişliği,
Height ile butonun yüksekliği belirtilir.



Custom butonunu klikleyerek butonu daha da özelleştirebilirsiniz.Açılan pencerede Play sound bölümünde ;
On click özelliğinde buton kliklendiği zaman kullanılacak ses efekti dosyası Browse butonu kliklenerek bilgisayarınızdan seçilir.
On hover  özelliğinde mouse buton üzerine geldiğinde kullanılacak ses efekti dosyasını belirtmeye yarar.
Custom bölümünde;
Button'da kullanılması istenen resim dosyalarını belirtmeye yarar.On hover'de mouse üzerine gelindiği zaman kullanılacak resim dosyasını belirtmeye yarar.Gerekli seçimleriniz yaptıktan sonra OK butonu klikleyiniz ve tekrar OK butonunu klikleyiniz.Bir sonraki butonu tanıtmak için imleçi pozisyonlayınız ve Insert menüsünden Component sonrada Hover Buton menü seçeneğini klikleyiniz veya bir önceki butonu klikleyiniz, kopyalayınız ve bir sonraki butonun yerine yapıştırınız.
Altalta butonlar arasındaki boşluğu küçültmek için butonların tümünü seçtikten sonra Format menüsünden Paragraph'ı seçiniz ve Spacing bölümünde Before değerini "0", After değerini "1" veya 2 (veya hangi değer ile gözünüze hoş geliyorsa o değer) yapınız.
Yanyana butonlar arasındaki mesafeyi ise Tab tuşuna gereği kadar basarak veya aradaki boşluğu klikleyip Delete ( Backspace) tuşuna basarak ayarlayabilirsiniz.Daha sonra buton özelliklerini değiştirmek için ise butonun üzerinde mouse'un sağ butonunu klikleyiniz açılan menüden Hover Buton Properties menü seçeneğini klikleyiniz.

Yukarıdaki pencereye uygun bir pencere yaparak sizde denemeler yapınız.



[ Appletler -Ana Sayfa - Javascript - Download  - Favoriler-Grafik ]