div per js (jquery) ein/ausblenden ?!

LRG · 20.01.2010

nabend,

wie man vielleicht schon mitbekommen hat, bin ich gerade dabei js etwas zu verwenden.

ich habe nun folgendes Problem:

Ich möchte einen ganz bestimmten DIV-container sichtbar bzw. unsichtbar machen.
Ich habe etliche codesnippets gefunden. Mit jquery und ohne...nichts hat geholfen und ich weiß einfach nicht was ich falsch mach ?!

ich hab den code hier mal aufs simpelste reduziert, denn selbst das funktioniert nicht:

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
    <link rel="stylesheet" href="css/style.css" type="text/css" />
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript" src="js/fadeslideshow.js">
    
    /***********************************************
    * Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
    ***********************************************/
    
    </script>
    <script type="text/javascript">    
        $(document).ready(function(){
            $('#toggler350').show()
        });
    </script>
    </head>
    <body>                
        <div id="toggler350" style="display:none;">
            <a href="#" class="prev"><img src="pic/left.png" style="border-width:0" /></a><a href="#" class="next"><img src="pic/right.png" style="border-width:0" /></a>
        </div>
    </body>
</html>

Im oberen Teil seht ihr die eingebunden jquery und die für die gallerie verwendete js datei...(die gallerie funktioniert soweit, hier nur aus übersichtsgründen weggelassen)

Hintergrund des ganzen ist der folgende. Auf meiner Seite können per navi die einzelnen Gallerien geladen werden. Diese sind dann entweder im Hoch oder im Querformat und je nachdem welches Format nun kommt, möchte ich einen anderen "toggler" div angezeigt (und den anderen natürlich ausgeblendet) haben. Somit befinden sich die "prev" u. "next" pfeile immer zentriert unter der gallerie...

ich hoffe das war soweit verständlich

um hilfe wäre ich sehr dankbar da ich weder mit der jquery methode (hier verwendet) noch mit der normalen per "getelementid...." einen erfolg erzielen konnte -.-

vielen dank,

LRG

sokie · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

waruwillst du überhaupt für die Bilder DIV container verwenden?
in einen SPAN geladen, der per text-align zentriert ist, ist es egal, ob da ein <img> im hoch- oder querformat kommt.

MyBad · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

Also ich verstehe dein Problem irgendwie so gar nicht.

Versuchst du das DIV-Element mit der ID "toggler350" beim fertig laden der Seite anzuzeigen und das klappt aber nicht!? Oder hast du ein anderes Problem?

fishhunter · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

also wenn du ledeglich den div container ausblenden willst solltest du über javacript mit den css style eigenschaften des containers spielen, hätte da vll sowas im sinn:

HTML:

<input type="button" onclick="document.getElementById('deine_id').style.display='none';" />

<div id="deine_id"><img src="<url>" width="100" height="100"></div>

wenn du es mehr ausgeblendet haben möchtest solltest du mit der css eigenschaft opacity etwas machen können, denke da an ein window.setTimeOut() oder an eine schleife...

LRG · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

sokie schrieb:
waruwillst du überhaupt für die Bilder DIV container verwenden?
in einen SPAN geladen, der per text-align zentriert ist, ist es egal, ob da ein <img> im hoch- oder querformat kommt.

entweder hast du nicht genau verstehen können was ich mein oder ich versteh nicht was du meinst.
es gibt zwei galleriegrößen die geladen werden. 350 und 950 (breite) und um zu jeder gallerie eine ordentlich zentrierte "togglebar" zu haben, hab ich mir dafür zwei divs hergerichtet.
Wie sollte ein span das lösen können ? dem muss ich ja auch ne breite angeben...und in dieser zentriert er sich dann ?!

also wenn du ledeglich den div container ausblenden willst solltest du über javacript mit den css style eigenschaften des containers spielen, hätte da vll sowas im sinn:

HTML-Code:
<input type="button" onclick="document.getElementById('deine_id').style.display='none';" />

<div id="deine_id"><img src="<url>" width="100" height="100"></div>
wenn du es mehr ausgeblendet haben möchtest solltest du mit der css eigenschaft opacity etwas machen können, denke da an ein window.setTimeOut() oder an eine schleife...

habe ich auch schon versucht (in meim beispiel ist jetzt nur eben die jquery methode verwendet).
ich habe anstatt eines buttons einen <a> tag genommen, der eine js funktion aufruft. diese hat dann wie in deinem beispiel per "document.get...." mit den css eigenschaften gespielt. Hat alles nichts gebracht...

Also ich verstehe dein Problem irgendwie so gar nicht.

Versuchst du das DIV-Element mit der ID "toggler350" beim fertig laden der Seite anzuzeigen und das klappt aber nicht!? Oder hast du ein anderes Problem?

genau! da ich wie gesagt, meinen code jetzt aufs wesentliche reduziert habe um die funktion ansich erstmal zum laufen zu bringen...
ich stelle den div "toggler350" per css auf unsichtbar und möchte ihn dann per js (sobald die seite fertig geladen ist) anzeigen.
Lade ich aber meine seite bleibt der div einfach unsichtbar ?!

MyBad · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

Nutzt du den Firefox? Wenn ja schau mal in die Fehlerkonsole (Extras -> Fehlerkonsole), ob dort ein JS-Fehler angezeigt wird. Denn von deinem Quelltext her und dein JQuery-Funktion sieht alles richtig aus.

LRG · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

MyBad schrieb:
Nutzt du den Firefox? Wenn ja schau mal in die Fehlerkonsole (Extras -> Fehlerkonsole), ob dort ein JS-Fehler angezeigt wird. Denn von deinem Quelltext her und dein JQuery-Funktion sieht alles richtig aus.

ohboi. peinlich...ich arbeit zwar schon länger mit ff aber erst seit kurzem mit js

ich werd mal reinschaun wenn ich daheim bin.
hoffen wir das ich dann schlauer bin, ich hab nämlich keine anderen möglichkeiten als entweder die per jquery oder die direkt per document.get... im internet gefunden.

dank dir aufjedenfall schonmal ;-)

MyBad · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

Hab mal gerade mit deinem Quelltext getestet. Weder das DIV wird eingeblendet noch wirft mir die Fehlerkonsole einen Fehler aus. Das ist echt merkwürdig...

LRG · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

MyBad schrieb:
Hab mal gerade mit deinem Quelltext getestet. Weder das DIV wird eingeblendet noch wirft mir die Fehlerkonsole einen Fehler aus. Das ist echt merkwürdig...

dankeschön für die arbeit

ja, selbiges dachte ich mir nach 3 std. umhertesten auch...verflucht, und jetzt:hmpf:

LowkaZ · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

Code:

jQuery(function(){
alert(jQuery('#toggler350').css('display'));
jQuery('#toggler350').css('display','block');
alert(jQuery('#toggler350').css('display'));
});

ansonsten blende mal die div per css aus und benutz

Code:

<span onclick="jQuery('#toggler350').toggle();">toggle</span>

und beobachte was in Firebug passiert (solltest du dir übrigens installieren)

LRG · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

LowkaZ schrieb:
Code:

jQuery(function(){ alert(jQuery('#toggler350').css('display')); jQuery('#toggler350').css('display','block'); alert(jQuery('#toggler350').css('display')); });

ansonsten blende mal die div per css aus und benutz

Code:

<span onclick="jQuery('#toggler350').toggle();">toggle</span>

und beobachte was in Firebug passiert (solltest du dir übrigens installieren)

hab ich ;-)

wozu is das jQuery immer vorn dran ? erkennt er das nicht selbst wenn das eine Methode aus dem Framework is da dieses ja eingebunden ist ?
ich probier dein code mal eben...auch wenn ich ihn noch nicht wirklich durchschaut hab mit dem alert etc.

kenn mich da zu wenig aus

LRG · 21.01.2010

AW: div per js (jquery) ein/ausblenden ?!

ok ersteres funktioniert (die alerts hab ich jetzt auch kapiert

) ich frag mich nur warum...muss man angeben das er auf jQuery zugreifen soll ?
ich hab das bisschen code noch nicht wirklich durchschaut...wie bekomm ich nun da die abfrage hin

Wenn toggler350 unsichtbar, dann schalt toggler350 sichtbar und toggler 950 unsichtbar ?

ich glaub daran würd nämlich gleich als nächstes scheitern

dank dir soweit aber schonmal recht herzlich

EDIT:

hab ne lösung ohne if, geht genauso. funktioniert jetzt also, vielen dank nochmal ;-)