Kodları lütfen aşağıdaki butonları kullanarak renklendirin. Örnek: <php> echo "Selam Dünya"; </php>
Yardım
karakter kaldı

CSS Hover

Merhabalar,
Aşağıda verdiğim kodlarda "1.text" yazısının üstüne geldiğimizde, bütün "1.text" yazılarının hover efekti almasını istiyorum. Bunu nasıl yapabilirim? Şimdiden teşekkürler.

<table>
<tr>
    <td><div>1.text</div></td>
    <td><div>2.text</div></td>
</tr>
<tr>
    <td><div>1.text</div></td>
    <td><div>2.text</div></td>
</tr>
</table>

<table>
<tr>
    <td><div>1.text</div></td>
    <td><div>2.text</div></td>
</tr>
<tr>
    <td><div>1.text</div></td>
    <td><div>2.text</div></td>
</tr>
</table>
+0
-0
Cevaba KatılıyorumKatılmıyorum
Cevap Yaz Yorum Yaz Arşivime Ekle Takip Et

Doğru Cevap

  • bilisimtr adlı üyenin fotoğrafı
    10 yıl önce yazılmış
    27 cevap - 6 soru
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script>
    
    $(document).ready(function(){
    	
    $('.bir').hover(function() {
    	$(".bir").addClass("hover");
    	
    	 }).mouseleave(function() {
        $(".bir").removeClass("hover");
      });
    
    
    }
    );
    </script>
    
    <style type="text/css">
    .bir:hover,.hover
    {
    	color:#3C0;
    }
    
    </style>
    
    
    <table>
    <tr>
        <td><div class="bir">1.text</div></td>
        <td><div>2.text</div></td>
    </tr>
    <tr>
        <td><div class="bir">1.text</div></td>
        <td><div>2.text</div></td>
    </tr>
    </table>
    
    <table>
    <tr>
        <td><div class="bir">1.text</div></td>
        <td><div>2.text</div></td>
    </tr>
    <tr>
        <td><div class="bir">1.text</div></td>
        <td><div>2.text</div></td>
    </tr>
    </table>
    
    • NooBisH adlı üyenin fotoğrafı NooBisH
      Çok teşekkür ederim, bunun çoklu kullanımı nasıl olacak acaba?
      10 yıl önce yazılmış

Cevaplar

  • xuma adlı üyenin fotoğrafı
    10 yıl önce yazılmış
    171 cevap - 1 soru
    İlla div kullanman gerekmiyorsa;

    <table class="tablo">
    <tr>
        <td><a href="#">1.text</a></td>
        <td><a href="#">2.text</a></td>
    </tr>
    </table>
    

    .tablo a:hover{color:red;}
    


    bilismtr nin cevabını class kullanmadan da yapabilirsin

    $(function(){
        $('table div').hover(function(){
            $(this).addClass('hover');   
        },function(){
            $(this).removeClass('hover');
        });
    });
    

    Veya Internet explorer buglarını hiçe sayarak sadece css ile

    table tr td div:hover{
        color:red;
    }