CSS Eigenschaften je nach Seite ändern

    Hallo zusammen,


    es ist ewig her, dass ich mal selber mit javascript rumgebastelt habe, so dass es super wäre, wenn mir kurz jmd. die paar Zeilen Script mitteilen würde. Ich möchte eine CSS Eigenschaft einer Klasse ändern, je nachdem, auf welcher Seite einer Homepage man sich gerade befindet. Sinngemäß:

    If homepagelink http://XY/A, dann class="hupe" {height:10px}

    else class="hupe" {height:2000px}


    Wobei man sich die zweite Zeile vermutlich sparen kann, da dann sicher wieder das eigentliche CSS greift.


    Für euch sicher total albern, aber ich google mir da gerade n Wolf dran... Besten Dank! <3

    LG

    Nachtrag: Ist mir gerade erst bewusst geworden - es soll der erste Teil einer URL abgefragt werden also quasi "if URL http://XY/A/***"
    Die Seite hat ein paar Ankerpunkte, die sonst "stören" würden.

    Wenn du ja schon mal erfahrung mit JS hattest kriegst du das ja bestimmt hin wenn man dir Tipps gibt.


    Ich würde dann erstmal den Link auslesen "location.href;

    Dann die if Abfrage ob du da bis wo du sein solltest.

    Ist if dann Treffer dann gibst du den Container die Klasse

    Code
    cla=document.getElementById('testbox');  
cla.classList.add('hupe');

    Vorher dran denken das du die klasse Hupe auch in der Css datei schon erstellt hast

    Meine ersten und letzten Gehversuche diesbzgl. liegen über 12 Jahre zurück. Glaube inzwischen, dass sich sogar meine Fragestellung geändert hat, weil das so gar nicht gehen kann, was ich vorhabe...

    will gerade nur testhalber mal eine CSS Eigenschaft ändern. Haut aber nicht hin, weil ich nur blind rumstocher und zusammenwürfel... Mein Versuch sieht so aus:


    <script type="text/javascript">

    jQuery(document).ready( function(aendereCSS) {

    document.getElementByClassName('hupe').style.height = '0px';

    });

    </script>


    Was ist alles falsch?^^

    Du mischt da gerade Jquery und Vanilla Javascript ( sollte eigentlich trotzdem laufen,aber kein schöner Programmierstiel ).

    Aber da sind noch andere Fehler drinne warum es nicht geht.


    So sollte es gehen .

    Mit Jquery so

    Code
    $(document).ready(function(){
     $('.hupe').css('height','0px');
});

    und bei nativen Javascript

    Code
    document.addEventListener('DOMContentLoaded',function(){
document.getElementsByClassName('hupe')[0].style.height='0px';
});

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden