 Willkommen auf dem Portal für Mediengestalter
|
|
|
| Autor |
Nachricht |
elagil
Threadersteller
Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 30.03.2012 13:39
Titel
|
  |
|
geht nicht 
noch ein versuch:
| Zitat: | $menu.click(function(ev)
{
ev.preventDefault();
menuitem = $menu.index($(this));
menuitem=menuitem+1
seite = 0;
$('#ziel').hide();
$('#laden').show(); //das lade-gif wird gezeigt während das alte bild verschwindet
var ersatz = pfad + menuitem + "/" + seite + ".jpg";
$("#start").attr("src",ersatz);
if(ersatz.complete == true){ //ich weiß nicht, wie ich das neu geladene bild hier prüfen kann...
$('#laden').hide();
$('#ziel').fadeIn("slow");}
});
|
|
|
| |
  |
 |
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht: 
|
Verfasst Fr 30.03.2012 13:41
Titel
|
|
|
| elagil hat geschrieben: | | //ich weiß nicht, wie ich das neu geladene bild hier prüfen kann... |
.. hat doch bacon geschrieben 
http://api.jquery.com/load-event/
|
|
| |
|
|
|
Anzeige
|
|
|
elagil
Threadersteller
Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 30.03.2012 14:03
Titel
|
|
|
oh dann habe ich den load befehl erst falsch verstanden.. jetzt geht es
| Code: | $container.click(function(ev){
ev.preventDefault();
seite=seite+1;
if(seite==6){seite=1};
$('#ziel').hide();
$('#laden').fadeIn("slow");
var ersatz = pfad + menuitem + "/" + seite + ".jpg" ;
$("#start").attr("src",ersatz);
$("#start").load(function(){
$('#laden').hide();
$('#ziel').fadeIn("fast");})
}) |
wenn ich jetzt aber schnell hintereinander clicke, bleibt "laden" sichtbar auch wenn das bild schon da ist..
|
|
| |
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Fr 30.03.2012 14:14
Titel
|
|
|
| elagil hat geschrieben: | | wenn ich jetzt aber schnell hintereinander clicke, bleibt "laden" sichtbar auch wenn das bild schon da ist.. |
mit off() oder unbind() kannst du event-handler entfernen.
Oder du schmeißt ihn aus der funktion wenn $('#laden').is(':visible')
|
|
| |
|
|
elagil
Threadersteller
Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 30.03.2012 14:43
Titel
|
|
|
hm geht das so auch?
wenn ich einmal den .click handler mit unbind entferne, kriege ich ihn ja nicht wieder zurück..
| Code: | if($('#laden').is(':hidden')){
$container.click(function(ev){
ev.preventDefault();
seite=seite+1;
if(seite==6){seite=1};
$('#ziel').hide();
$('#laden').fadeIn("slow");
var ersatz = pfad + menuitem + "/" + seite + ".jpg" ;
$("#start").attr("src",ersatz);
$("#start").load(function(){
$('#laden').hide();
$('#ziel').fadeIn("fast");
})
})
} |
bringt leider nichts.
#laden ist mit "display:none" ausgeblendet
ebensowenig:
| Code: | if(document.getElementById("laden").style.display == "none"){
$container.click(function(ev){
ev.preventDefault();
seite=seite+1;
if(seite==6){seite=1};
$('#ziel').hide();
$('#laden').fadeIn("slow");
var ersatz = pfad + menuitem + "/" + seite + ".jpg" ;
$("#start").attr("src",ersatz);
$("#start").load(function(){
$('#laden').hide();
$('#ziel').fadeIn("fast");
})
})
} |
Zuletzt bearbeitet von elagil am Fr 30.03.2012 14:55, insgesamt 1-mal bearbeitet
|
|
| |
|
|
elagil
Threadersteller
Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 30.03.2012 17:07
Titel
|
|
|
| Code: | (function(){
var
pfad = "images/stuhlbilder/" ,
pfad2 = "texte/" ,
menuitem = -1 ,
seite = 0 ,
$menu = $('.menu') ,
$container = $('#klickflaeche') ,
$ziel = $('#ziel') ,
$laden = $("#laden") ,
$start = $("#start");
if($laden.is(":hidden") ) {
$menu.click(
function(ev){
ev.preventDefault();
menuitem = $menu.index($(this));
seite = 0;
$($ziel).hide();
$($laden).show();
var ersatz = pfad + menuitem + "/" + seite + ".jpg";
$($start).attr("src",ersatz);
$($start).load(function(){
$($laden).hide();
$($ziel).fadeIn("fast");})
})
}
if($laden.is(":hidden") ) {
$container.click(
function(ev){
ev.preventDefault();
seite=seite+1;
if(seite==6){seite=1};
if (menuitem != -1 && seite != 0) {
$($ziel).hide();
$($laden).show();
var ersatz = pfad + menuitem + "/" + seite + ".jpg" ;
$($start).attr("src",ersatz);
$($start).load(function(){
$($laden).hide();
$($ziel).fadeIn("fast");
})
}})
}})(); |
ah hat geklappt...ich habe jquery 1.4 durch 1.7 getauscht, vielleicht war das ein grund.
|
|
| |
|
|
elagil
Threadersteller
Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 30.03.2012 20:33
Titel
|
|
|
hoffentlich letztes problem: wenn ich einen menüeintrag aufrufe und denselben nochmal klicke, erscheint das lade-gif und bleibt dort für immer!
das problem tritt nur bei safari auf..
|
|
| |
|
|
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht:
|
Verfasst Sa 31.03.2012 20:52
Titel
|
|
|
Das Problem ist, dass die Bilder die bereits geladen wurden kein load event mehr feuern, da sie ja bereits geladen sind.
Zudem habe ich noch mal ein wenig "aufgeräumt" (ist allerdings ungetestet)
| Code: | (function(){
var pfad = "images/stuhlbilder/",
pfad2 = "texte/",
menuitem = false,
seite = 0, // seite beginnt wieder bei 0, siehe unten.
seiteMax = 6, // letzte seite: wieder an einer zentralen stelle um es ggf. überall einfach ändern zu können
bilderSpeicher = {}, // dient als speicher welche bilder schon geladen wurden. dazu später mehr.
$menu = $('.menu'),
$container = $('#klickflaeche'),
$ziel = $('#ziel'),
$laden = $("#laden"),
$start = $("#start");
$menu
.on('click',function(ev){ // habe jetzt erst gesehen, dass du ein aktuelles jQuery verwendest: dann solltest du "on" statt "click" verwenden. mehr infos dazu hier: http://www.andismith.com/blog/2011/11/on-and-off/
ev.preventDefault();
if(istLadenSichtbar()) { // wenn laden sichtbar, führe den rest der funktion nicht aus.
return false;
}
menuitem = $menu.index($(this));
seite = 0;
var bildPfad = pfad + menuitem + "/" + seite + ".jpg";
ladeBild(bildPfad); // das laden der bilder ist ja in beiden fällen gleich: daher wird's ausgelagert in eine funktion (DRY!) ;)
});
$container
.on('click',function(){ // s.o. bezüglich "on"
if(istLadenSichtbar() || !menuitem) { // wenn laden sichtbar, oder noch kein menüitem geklickt (menuitem = false) führe den rest der funktion nicht aus.
return false;
}
// ev.preventDefault() kann man sich hier eigentlich sparen, da ein div kein default verhalten bei klick hat.
if(seite >= seiteMax){
seite = 0
};
zeigeLaden();
var ersatz = pfad + menuitem + "/" + seite + ".jpg";
ladeBild(bildPfad);
seite = seite+1; // die seite wird erst am ende erhöht, so kannst du bei "0" beginnen.
});
var istLadenSichtbar = function() { // gibt zurück ob laden sichtbar ist oder nicht
return $laden.is(":hidden");
}
var zeigeLaden = function() { // zeigt den "laden" layer
$ziel.hide(); // die $() um das $ziel etc. kannst du dir sparen. deswegen haben wir den kram ja oben schon gespeichert. ansonsten machst du jedes mal wieder einen funktionsaufruf statt die gespeicherte variable zu benutzen: das kostet performance!
$laden.show(); // s.o.
}
var zeigeZiel = function(neu) { // zeigt den "ziel" bereich
$laden.hide();
$ziel.fadeIn("fast");
}
var ladeBild = function(bildPfad) {
zeigeLaden(); // zeige die "laden" grafik an
$start
.attr("src",bildPfad); // setze den bildpfad, der als parameter an die funktion übergeben wurde.
if(!bilderSpeicher.hasOwnProperty(bildPfad)) { // bilder müssen nur neu geladen werden, wenn sie nicht schon mal geladen wurden (caching!). hier wird überprüft ob der pfad zum bild bereits in unserem objekt "bilderSpeicher" vorhanden ist. ansonsten können wir uns das .load() nämlich sparen.
bilderSpeicher[bildPfad] = bildPfad; // bild existierte noch nicht im "zwischenspeicher". da wir es jetzt laden werden, können wir es hinzufügen.
$start
.load(zeigeZiel); // führe nach dem laden die funktion zeigeZiel aus
} else {
zeigeZiel(); // das bild wurde schon mal geladen: also müssen wir es eigentlich nur noch anzeigen.
}
}
})(); |
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
3D-Würfel unerwünscht!
DIV Container bei Mouseover über DIV Container anzeigen
DIV-Container soll anderen DIV-Container verdrängen
Variabler Div-Container bis zum mittigen Div-Container
CSS: Container im Container Vertikal zentrieren
CSS - was ist ein div-container?
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|
