İyi bir gelecek, size iyi gelecek | Weeb Akademi
bilgi@weebakademi.com | 0 850 303 88 15 | Giriş Yap | Kayıt Ol
 
     

    Menü öğelerinin üzerine geldiğinizde, opacity’si düşürülerek, öğelere şeffaflık veren kodlar aşağıdadır.

    Faydalı olması dileğiyle.

    <head></head> tagleri arasına jquery kütüphanesini çağırmak için gereken kodu yazıyoruz:

    1
    
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>

    head tagleri arasında <style></style> tagleri içine yazmanız gereken Css kodları :

    1
    2
    3
    4
    5
    6
    
    #menu a { text-decoration:none; color:#039; padding-left:10px; }

     

    <body></body> tagleri arasına yazmamız gereken kodlar ise aşağıdadır.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    
    <div id="menu">
    <a href="http://www.dogusefe.com">Anasayfa</a>
    <a href="http://webtasarim.dogusefe.com/web-tasarim-dersleri">Web Tasarım Dersleri</a>
    <a href="#">Resimler</a>
    <a href="#">İletişim</a>
    </div>
    
    <script>
    $("#menu a").hover(function()
    {
    $(this).animate({
    "opacity": "0.3"
    }, 100); },
    function()
    {
    $(this).animate({
    "opacity": "1"
    }, 100);
    });
    </script>

     
     

    Referanslarımız