kostenloser Webspace werbefrei: lima-city

JQuery slide - Problem

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   programtools

   programtools hat kostenlosen Webspace.

   9:20, 22.12.2009

   HI
   Ich habe ein JQuery slide auf meiner Seite:
   

   <div  class="eintrag" style="width:950px;margin-left:300px;">
   <div style="background-image:url(DLT.png);padding-left:10px;"><b><u>Eintrag ins Gästebuch machen:</u></b></div>
   
   <div class="eintrag" style="style="background-image:url(DLM.png);color:black;padding-left:10px;margin-top:10px;width:950px;text-align:left;overflow:auto;margin-left:2px;">
   <center>
   <form name="gbookpost" activate="" method="Post">
   <Textarea style="background-color:F07800;color:000000;" cols="80" rows="7" name="text"></textarea>
   <br>
   <input type="submit" value="abschicken">
   <input type="reset" value = "Textfeld Leeren">
   </div>
   
   <input type="Button" class="toggle" value="neuen Eintrag machen"/>
   </center>
   </form>
   
   <hr style="color:orange;"></br>
   </div>
   </div>

   
   
   Jquery ist nat. eingebunden und der JQuery tag/code">Code im Head siht so aus:
   

   <script type="text/javascript" src="jquery.js"></script>
   <script type="text/javascript">
   $(document).ready(function(){
   
   $("input.toggle").click(function(){
   $(this).prev("div.eintrag").slideToggle("slow")
   });
   });
   </script>

   
   
   So das ganze klappt recht gut (einfahren und ausfahren) doch wenn ich folgendes ändere um den neuen Eintrag button nicht mehr zentriert zu haben gehts nichtmehr.
   

   div  class="eintrag" style="width:950px;margin-left:300px;">
   <div style="background-image:url(DLT.png);padding-left:10px;"><b><u>Eintrag ins Gästebuch machen:</u></b></div>
   
   <div class="eintrag" style="style="background-image:url(DLM.png);color:black;padding-left:10px;margin-top:10px;width:950px;text-align:left;overflow:auto;margin-left:2px;">
   <center>
   <form name="gbookpost" activate="" method="Post">
   <Textarea style="background-color:F07800;color:000000;" cols="80" rows="7" name="text"></textarea>
   <br>
   <input type="submit" value="abschicken">
   <input type="reset" value = "Textfeld Leeren">
   </div>
   </center> <!-- hier ist das center jetzt doch dann klappts nichtmehr -->
   <input type="Button" class="toggle" value="neuen Eintrag machen"/>
   <!-- hier war das center und da hats geklappt-->
   </form>
   
   <hr style="color:orange;"></br>
   </div>
   </div>

   
   
   Ich möchte diesen button nähmlich nicht minimiert sondern linksbündig haben.
   
   Hoffe ihr wisst was ich da machen kann!
   
   MFG

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. qap2

   

   qap2 hat kostenlosen Webspace.

   11:43, 22.12.2009

   Ich kann mir es nicht anders erklären:
   Falsche HTML-Struktur.
   Schau, dass deine div-Elemente so gebaut sind, das sind richtig ineinander und mit anderen HTML-Elementen verschachtelt sind.
   Kannst du einen Link posten, auf welcher Seite du rumexperimentierst?
   Habe gerade keine Vorstellung, nur die Idee ein zusätzliches div-Elemente zu nehmen und die Positionierung über text-align zu machen.
   Gruß,
   dex (qap2-Team)
4. Autor dieses Themas

   programtools

   programtools hat kostenlosen Webspace.

   12:42, 22.12.2009

   mmm ich experimentiere mom lokal... (geht schneller)
   
   Aber ich habs dir mal hochgeladen:
   (allerdings nur html also ohne die gästebuch.php funktion aber das ist egal)
   -->http://programtools.lima-city.de/jquery_experiment/index.html
   
   Hoffe das hilft dir weiter mir zu helfen xD
   MVG

5. w******s

   13:05, 22.12.2009

   Ersetz doch mal diese Zeile

   $(this).prev("div.eintrag").slideToggle("slow")

   dann mit dieser:

   $(this).prev("center").prev("div.eintrag").slideToggle("slow")

6. Autor dieses Themas

   programtools

   programtools hat kostenlosen Webspace.

   17:43, 22.12.2009

   Danke aber da tut sich leider garnix.
   Bin grad n bissel ratlos...
   MFG

7. bandi999

   bandi999 hat kostenlosen Webspace.

   21:00, 22.12.2009

   Hi,
   
   wie schon geschrieben solltest du die Reihenfolge der Tags mal überdenken. Das Tag, welches zuletzt geöffnet wurde sollte dann als erstes geschlossen werde.
   Ich habe die Sache mal mit float:left umgebaut. Der folgende Code funktioniert bei mir im FF und IE8:

   <DIV style="WIDTH: 950px; MARGIN-LEFT: 300px" class=eintrag>
   <DIV style="BACKGROUND-IMAGE: url(DLT.png); PADDING-LEFT: 10px"><B><U>Eintrag 
   ins Gästebuch machen:</U></B></DIV>
   <CENTER>
   <FORM method=post name=gbookpost activate="">
   <DIV style="style: " class=eintrag 
   background-image:url(DLM.png);color:black;padding-left:10px;margin-top:10px;width:950px;text-align:left;overflow:auto;margin-left:2px;?>
   <TEXTAREA style="BACKGROUND-COLOR: #f07800; COLOR: #000000" rows=7 cols=80 name=text></TEXTAREA> 
   <BR>
   <INPUT value=abschicken type=submit> 
   <INPUT value="Textfeld Leeren" type=reset> 
   </DIV>
   <INPUT class=toggle style="float:left;" value="neuen Eintrag machen" type=button> 
   </FORM>
   </CENTER>
   <br>
   <HR style="COLOR: orange">
   <BR></DIV>

   Ob es optisch nun ganz genau so ist, wie du willst, weiß ich natürlich nicht.
   
   Gruß
   Manni

8. fatfreddy

   

   fatfreddy hat kostenlosen Webspace.

   1:59, 23.12.2009

   Idee: der Firefox hat manchmal Proleme mit inline-CSS in Verbindung mit Class-Definitionen. Style="XXX" in eine Classdefinition zu ändern könnte helfen.
   
   FF
9. Autor dieses Themas

   programtools

   programtools hat kostenlosen Webspace.

   20:40, 23.12.2009

   ok vielen dank
   kann den code aber leider nicht testen, da man im Textfeld / codefeld nicht den gesammten inhalt kopieren kann. da iss wohl irgendein Fehler ;)
   werd bis morgen warten und dann sagen obs klappt! MVG

10. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?