nicht angemeldet
Hallo,
wie schaut denn eine sinnvolle jQuery-Struktur für ein Miniframework aus (fang gerade an mich einzuarbeiten)?
Ansatz (nur mal so als Beispiel!):
$(document).ready(function(){
// Vorbereiten einer Diashow für alle Element der Klasse "dia-show"
$(".dia-show").dosomething
...
//Starte Diashow
$(".dia-show-starter").click(function(){
// Anweisungen für Diashow-Ablauf
});
// Vorbereiten von Elementen, die ein parallax-scrolling der Seite ermöglichen
$(".parallax-element").dosomething
...
//Starte Parallax-Scrolling
$(".parallax-scrolling-starter").click(function(){
// Anweisungen für Diashow-Ablauf
});
// uswundsofort
})
Das wird ja sehr bald sehr unübersichtlich...
Also, neuer Ansatz:
$(document).ready(function(){
(function() {
// Vorbereiten einer Diashow für alle Element der Klasse "dia-show"
$(".dia-show").dosomething
...
//Starte Diashow
$(".dia-show-starter").click(function(){
// Anweisungen für Diashow-Ablauf
});
})();
(function() {
// Vorbereiten von Elementen, die ein parallax-scrolling der Seite ermöglichen
$(".parallax-element").dosomething
...
//Starte Parallax-Scrolling
$(".parallax-scrolling-starter").click(function(){
// Anweisungen für Diashow-Ablauf
});
})();
// uswundsofort
})
Jetzt habe ich es "optisch gruppiert", aber mehr auch nicht... Soll man überhaupt alle Anweisungen inerhalb einem
$(document).ready(function(){})
schreiben oder besser für jeden Part (im Beispiel: Diashow und Parallax-Scrolling) ein eigenes
$(document).ready(function(){})
verwenden?
Und soll man die function direkt hier reinschreiben:
$(".dia-show-starter").click(function(){
});
oder besser eine funtion aufrufen?
$(".dia-show-starter").click(
var diashow = new diaShow();
diashow.start();
);
In erster Linie gehts mir um Übersichtlichkeit und Wartbarkeit. Wie macht ihr das?
Viele Grüße
Siri