Frage zum Thread LoadjQuery Droplet

WebsiteBaker Support (2.8.x) > Diskussion über WB (closed)

<< < (2/7) > >>

Luisehahne:
Mein Motto ist "Alles kann nichts muss". So gesehen hast du recht, nur sollte dann im Droplet abgefangen werden, ob jquery bereits geladen ist, macht man mit if(jquery) { soweit ich das weiss, mal testen. Du musst auf jeden Fall verhindern, dass es doppelt geladen wird.

Das Problem am original Thread war nur, bzw. kam es so rüber, das die Einbindung nicht klappt. Wir haben alle so unsere Probleme mit dem Englischen. Es ist schnell was verkehrt verstanden oder erklärt

Dietmar

maverik:
diese antwort bezieht sich auf https://forum.WebsiteBaker.org/index.php/topic,16951.msg112191.html#msg112191

martin wir haben beide das gleiche anliegen, einfachheit, aber auch beide das gleiche problem. du wehrst dich gegen js weil du es wahrscheinlich noch nicht verstanden hast und ich wehre mich gegen droplets respektive php weil es mir komplizierter erscheint und mir zuviel einarbeitung abverlangt.

wenn mein template mit dem besagten code

--- Code: ---<?php
if (function_exists('register_frontend_modfiles')) {
        register_frontend_modfiles('css');
        register_frontend_modfiles('jquery');
        register_frontend_modfiles('js');
} ?>
--- End code ---

ausgestattet ist habe ich damit nichts mehr am hut. brauche es nicht mehr anfassen, egal welches plugin nun kommt.

so und nun nehmen wir unseren text editor und erstellen eine jquery_frontend.js

als beispiel nehme ich jetzt mal http://bxslider.com/

hier steht als Implementation:

--- Code: ---$(document).ready(function(){

$('#any_element').bxSlider();

});

--- End code ---

wenn ich das so in meine js schreibe fehlt mir nur noch der pfad zum script das es läuft und am besten noch das es nur eingebunden wird wenn es auch gebraucht wird. dazu ergänze ich zwei zeilen

--- Code: ---if($("#any_element").length)
{
$.insert(WB_URL+'/der/pfad/zum/script/jquery.bxSlider.js');
--- End code ---

was dann so aussieht

--- Code: ---$(document).ready(function(){

if($("#any_element").length)
{
$.insert(WB_URL+'/der/pfad/zum/script/jquery.bxSlider.js');

$('#any_element').bxSlider();
}
});
--- End code ---

soderle nun wird das script nur eingebunden wenn auf der entsprechenden seite das div any_elememt gefunden wird.

der bxslider ist somit in der grundfunktion lauffähig.

angaben für das weitere feintuning also die parameter stehen auf jeder entwicklerseite und können so einfach ergänzt werden

--- Code: ---$(document).ready(function(){

if($("#any_element").length)
{
$.insert(WB_URL+'/der/pfad/zum/script/jquery.bxSlider.js');

$('#any_element').bxSlider({
mode: 'ticker',
speed: 8000,
width: 600

});
}

hier weitere scripte inserten auf gleichem weg

});
--- End code ---

ready for take off mit einer handvoll zeilen die schnell erklärt und kopiert sind. weitere plugins füge ich auf gleichen wege hinzu. ist die datei einmal vorhanden habe ich in minuten mit copy & paste ein neues plugin hinzugefügt.

während in villa riba das plugin funktioniert wird in villa bacho noch am droplet gecodet. :-D

kannst du mir bitte genauso einfach erklären wie ich ein droplet in dieser kurzen zeit erstelle?

ich habe vom coden echt sowas von keine ahnung aber das habe ich begriffen und kann es nach vollziehen, weiß was passiert.

achja, ich habe da noch so etwas schwach im hinterkopf das ein droplet wohl seinen dienst einstellt wenn es fehler auf der seite gibt und ich dann nur noch den dropletnamen auf der seite sehe. das passiert hier nicht.

maverik:
ich bin ja wirklich lernwillig und so habe ich jetzt mal das scroll to top tutorial durch geackert...puh

in meiner jquery_frontend.js habe ich

--- Code: ---if($("#totop").length)
{
   $.insert(WB_URL+'/include/jquery/plugins/jquery.scroll.pack.js');
   $.insert(WB_URL+'/include/jquery/plugins/jquery.easing.js');

   $("#totop").scrollToTop({
   speed: "normal",
   ease: "easeOutCirc",
   start: 500
});
}
--- End code ---

in meiner index vom template steht

--- Code: ---<a id="totop" href="#" style="display: inline;" title="Seitenanfang"><span>^</span></a>
--- End code ---

und in die style.css habe dann noch das

--- Code: ---#totop {
   background:transparent url(../img/go-up.png) no-repeat scroll 0 0;
   position:fixed;
   bottom:30px;
   right:30px;
   width:48px;
   height:48px;
   cursor:pointer;
   display:none;

}
a#totop span {
display:none;
}

--- End code ---

viele wege führen nach rom aber dieser hier kommt mir kürzer vor, vielleicht weil ich das nachvollziehen kann...

--- Quote ---Diese Anker sind per Link verbunden, auch wenn die Animation und das langsame Einblenden des Scroll to Top Buttons nicht funktionieren, weil Javascript im Browser deaktiviert ist, funktioniert die Grundfunktion (An den Seitenanfang zu gelangen) trotzdem.
--- End quote ---

mit abgeschaltetem javascript komme ich auf der turorial seite nicht mehr an den seitenanfang

Stefek:
Hallo Maverik,
ich gebe zu, das Einbinden von Plugins auf diese Weise ist recht einfach.

Mein einziger "Einwand" dabei ist, dass man nicht unbedingt die "fette" UI dafür braucht.

Dieser Aufruf hier:
register_frontend_m odfiles('jquery');
holt aber die ganze "fette Kuh", lädt sie und packt sie im Browsercache ab.

Da fehlt mir irgendwie zusätzlicher Parameter, wetwas in der Art:
register_frontend_m odfiles('jquery', 'ui'); usw.

Ich weigere mich einfach 200kB zu downloaden, um ein 8kB Plugin anzustöpseln.

Und ich denke, das ist auch Martins Triebfeder bei der ganzen Droplets geschichte.

Ein weiteres Problem, das einbinden von CSS Files über die UI geht mit ausgeschaltetem JS gar nicht.
Mit einem Droplet a lá Mr-Fan schon. :-)

Gruß,
Stefek

maverik:
schau mal hier http://jqueryui.com/themeroller/ und hier http://jqueryui.com/download

da kannst du die fette kuh abspecken, dir eine ui nach deinen bedürfnissen zusammenschrauben. und wenn js abgeschaltet ist lädt die ui.js nicht und dann brauchst auch keine ui.css

Navigation

[0] Message Index

[#] Next page

[*] Previous page

Go to full version