Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „Jquery - nun habt ihr mich soweit ;) - diverse Probleme mit Funktionen“

Crackp0t

Aktives Mitglied

Habe mich nun dazu entschlossen, mit JQuery anzufangen und versuche nun meine Funktionen in die JQuery Syntax zu bringen. Die Funktion die ich umschreiben möchte ist folgende:

Beschreibung:
Jedes Element mit der Klasse "center_w" wird in Relation zu der Fenstergröße horizontal und vertikal zentriert. Jedes Element mit der Klasse "center_p" wird in Relation zum Parent-Objekt horizontal und vertikal zentriert.

Diese Funktion wird später mit den Eventhandlern onload und onresize verknüpft.

Code:
PHP:
function makeAllCenter() {
    var center_elements = document.getElementsByTagName("*");
    for (var i = 0; center_elements.length > i; i++) {

        if (center_elements[i].className == "center_w") { 
            var center_window_v = (parseInt(center_elements[i].style.height))/2;
            var center_window_h = (parseInt(center_elements[i].style.width))/2;
            center_elements[i].style.top = window.innerHeight/2 - center_window_v;
            center_elements[i].style.left = window.innerWidth/2 - center_window_h;
        } else {
            if (center_elements[i].className == "center_p") {
                var center_parent_v = (parseInt(center_elements[i].style.height))/2;
                var center_parent_h = (parseInt(center_elements[i].style.width))/2;
                center_elements[i].style.top = (parseInt(center_elements[i].offsetParent.style.height))/2 - center_parent_v;
                center_elements[i].style.left = (parseInt(center_elements[i].offsetParent.style.width))/2 - center_parent_h;
            }
        }
    }
}
Mein Ansatz in JQuery ist nun folgender:

Die Funktion soll erstmal nur die vertikale Zentrierung in Relation zu der Fenstergröße jedes Elements mit der Klasse "center_w" bewirken.

Code:
PHP:
$(".center_w").css('top',($(window).height()/2)-($(".center_w").css(height)/2));
Der relevante HTML- und CSS-Code für beide Scripts ist

HTML:
<style rel="text/css">
#toCenter {
background-color: #000;

position: absolute;
top: 0;
left: 0;
width: 100%;
height: 350px;
}
</style>
<div id="toCenter" class="center_w"></div>
Das Ganze funktioniert natürlich nicht, wäre ja auch zu schön gewesen. Die Ausgabe der Fehlerkonsole des FF ist folgede:

Code:
Fehler: elem.document.body is null
Quelldatei: file:///G:/testing/jqry.js
Zeile: 6216
Wo liegt der Fehler? Vergibt mir, falls der Code wirklich SO sch**** ist, is meine erste Funktion.

Außerdem habe ich eine Frage: Da sich das Element ja immer in der Mitte befinden soll, brauche ich ja wie oben beschrieben 2 Eventhandler. Kann ich die miteinander verknüpfen? Also jetzt ein Beispiel als Pseudocode:
window.onload.onresize(function() {doSomething;});

Danke schonmal im Voraus für eure Hilfe :)
 

sokie

Mod | Web

AW: Jquery - nun habt ihr mich soweit ;) - diverse Probleme mit Funktionen

Vergibt mir, falls der Code wirklich SO sch**** ist, is meine erste Funktion.

keine Ahnung ob das so ist, du hast uns ja, wie man in der Fehlermeldung (zeile 6200-fragmichmal) sehen kann, nur einen kleinen Ausschnitt gepostet. - ist eher was für Hellseher.

coden, ins web laden,link posten...

besonders vermissen tut man ja die obligate $(document).ready(function(){...
Eröffnung.
solange das dokument nicht geladen ist, gibt es auch keinen body (body ist null)

ps: zusammenfassen onload,onresize:
du kannst events in jQuery triggern unabhängig davon ob sie tatsächlich passieren:
Code:
$(document.ready(function(){
  $(window).resize(function(){
    //deine Anweisungen...
  });
  $(window).trigger('resize');
});
 
Zuletzt bearbeitet:

Crackp0t

Aktives Mitglied

AW: Jquery - nun habt ihr mich soweit ;) - diverse Probleme mit Funktionen

Die Fehlermeldung bezieht sich auf die JQuery Library "file:///G:/testing/jqry.js" wie ich ich sie runtergeladen habe. Mein Eigener Code ist nur die eine Zeile und im Head-Bereich der Seite definiert.
 

sokie

Mod | Web

AW: Jquery - nun habt ihr mich soweit ;) - diverse Probleme mit Funktionen

in der Zeile beziehst du dich auf elemente, die vor dem Laden der Seite nicht zur Verfügung stehen.
die sollte schon innerhalb der $(document)ready() funktion stehen.

oder

das script nach dem </body> notieren.
 

Crackp0t

Aktives Mitglied

AW: Jquery - nun habt ihr mich soweit ;) - diverse Probleme mit Funktionen

Danke!
Das ich auf sowas nicht komme... Hab das Script zum Laufen gebracht.
Weißt du noch was zu meiner 2. Frage im 1. Post?
//edit Ach hab grade dein Edit gelesen. hat sich erledig.
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
175.143
Beiträge
2.581.735
Mitglieder
67.210
Neuestes Mitglied
MaikMH78
Oben