0
Kayıt Ol

HTML çift tema

4

●

88

  • 14-06-2021, 05:32:41
    #1
    flexymedia
    flexymedia
    merhaba şuan dark temalı bir scriptim var üst tarafına bir buton ekleyip o bu tona bastıklarında 2. css i görmelerini istiyorum bunu nasıl yapabilirim detaylı anlatırsanız sevinirim yeni başladımda.
  • 14-06-2021, 05:47:07
    #2
    ealgan
    ealgan
    sayfa yenilemeden yapmak istersen js ile css dosyasını sonradan yükleyebilirsin.
    butona onclick verdin diyelim js fonksiyonu da dilersen nonscript tagları arasındaki css dosyasını nonscript taglarını kaldırarak aktif edebilir ya da data-src= gibi tanımladan tagın data src value kısmını alıp src olarak tanımlayabilirsin. yani yöntem çok

    sayfa yenileyerek yapacaksan da butona tıkladığında session tanımlayabilirsin o sessiondan sonra da session aktif mi değil mi kontrol ettirerek duruma göre css i gösterir veya göstermezsin. illa php session düşünme js session vs de yapabilirsin.

    tema değişiminden kastın yapı olarak aynı sadece renkler değişecekse renk csslerini bir arada toplayıp basit bir js koduyla tıklandığında sayfa yenilemeden renkleri değiştirebilirsin.
    ne demek istiyorum?
    body.tema1 .aside {background-color:red}
    body.tema1 .section{background-color:blue}

    body.tema2 .aside {background-color:red}
    body.tema2 .section{background-color:blue}

    js ile body tagını bulup clastlist remove ile tema1 kaldırıp tema2 yi ekletebilirsin
  • 14-06-2021, 07:00:22
    #3
    ereneser
    ereneser
    Anladığım kadar örnek olarak böyle birşey yapabilirsiniz ama sayfa yenileyince gitcektir bunları cerezlere kaydettirebilirsiniz
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 
    <style>
        div{
            padding: 20px;
            background-color: 
        }
    </style>
    
    
    
</head>

<body> 

    <div id="kutu1">KUTU 1</div>
    <div id="kutu2">KUTU 2</div>
    <div id="kutu3">KUTU 3</div>
    
    
    <input type="button" id="btn1" value="TIKLA">
 
 
 
    <script>
        $(document).ready(function(){
            $("#btn1").click(function(){
                $("#kutu1").css({"background-color":"blue"});
                $("#kutu2").css({"background-color":"red"});
                $("#kutu3").css({"background-color":"orange"});
                $("body").css({"background-color":"aqua"});
            });
        });
    </script>
</body>
  • 14-06-2021, 15:40:36
    #4
    flexymedia
    flexymedia
    Kutu 2 mesela html taraflı herşey aynı ama css taraflı 2. seçtiğim css olmasını istiyorum nasıl yaparım dark ve white tema gibi düşünün bastığında dark bastığında white
  • 14-06-2021, 15:44:08
    #5
    flexymedia
    flexymedia
    ealgan adlı üyeden alıntı: mesajı görüntüle
    sayfa yenilemeden yapmak istersen js ile css dosyasını sonradan yükleyebilirsin.
    butona onclick verdin diyelim js fonksiyonu da dilersen nonscript tagları arasındaki css dosyasını nonscript taglarını kaldırarak aktif edebilir ya da data-src= gibi tanımladan tagın data src value kısmını alıp src olarak tanımlayabilirsin. yani yöntem çok

    sayfa yenileyerek yapacaksan da butona tıkladığında session tanımlayabilirsin o sessiondan sonra da session aktif mi değil mi kontrol ettirerek duruma göre css i gösterir veya göstermezsin. illa php session düşünme js session vs de yapabilirsin.

    tema değişiminden kastın yapı olarak aynı sadece renkler değişecekse renk csslerini bir arada toplayıp basit bir js koduyla tıklandığında sayfa yenilemeden renkleri değiştirebilirsin.
    ne demek istiyorum?
    body.tema1 .aside {background-color:red}
    body.tema1 .section{background-color:blue}

    body.tema2 .aside {background-color:red}
    body.tema2 .section{background-color:blue}

    js ile body tagını bulup clastlist remove ile tema1 kaldırıp tema2 yi ekletebilirsin

    Sanarım yetersiz bilgimden dolayı anlayamadım... eğer discord whatsapp veya size ulaşabileceğim biryer varsa bana yardımcı olurmusunuz.