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

Yazı rengi değiştiren Javascript kodu

Merhaba,

Resimden bir tuş düşünelim.
<img src="/siyah_yazi.png" />
Bu tuşa ilk tıkladığımda tuşdaki resmin "siyah_yazi.png" yerine "beyaz_yazi.png" olarak değişmesini ve belirli bir bölgedeki yazıların rengini değiştirmesini,
İkinci tıklamamda ise tekrar "siyah_yazi.png" olmasını ve yine aynı bölgedeki yazıların renginin eski haline dönmesini istiyorum.
Aynı Toggle ile göster gizle yapmak gibi ama yazı rengi değişecek sadece.
Javascript ile bunu nasıl yapabilirim?

Umarım isteğimi anlatabilmişimdir. Teşekkürler.
+0
-0
Cevaba KatılıyorumKatılmıyorum
Cevap Yaz Yorum Yaz Arşivime Ekle Takip Et

Cevaplar

  • NooBisH adlı üyenin fotoğrafı
    10 yıl önce yazılmış
    4 cevap - 10 soru
    Gizle/Göster Toggle JavaScripti ve yazı rengi değiştirme JavaScriptini birleştirdim güzel bir şey çıktı ortaya ama daha iyi bir çözümü olan varsa lütfen yazsın.

    <script language="javascript">
    function toggle1(showHideDiv, switchImgTag) {
            var ele = document.getElementById(showHideDiv);
            var imageEle = document.getElementById(switchImgTag);
            if(ele.style.display == "block") {
                    ele.style.display = "none";
    		imageEle.innerHTML = '<img onclick=turnBlack() src="/images/goster.png">';
            }
            else {
                    ele.style.display = "block";
                    imageEle.innerHTML = '<img onclick=turnGizle() src="/images/gizle.png">';
            }
    }
    
    function turnGizle() {
    var myPara = document.getElementById("changeText");
    myPara.style.color = "transparent";
    }
    
    function turnBlack() {
    var myPara = document.getElementById("changeText");
    myPara.style.color = "black";
    }
    
    </script>
    




    <a id="imageDivLink" href="javascript:toggle1('asd', 'imageDivLink');"><img onclick=turnGizle() src="/images/gizle.png"></a>
    
    <div id="asd" style="display: block;"></div>
    
    <p id="changeText">Rengi değişecek yazı</p>
    


    "<div id="asd" style="display: block;"></div>" kısmını mecvuren kullanmalıyım aksi halde gizle göster çalışmıyor.