mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 28.03.2024 18:10 Benutzername: Passwort: Auto-Login

Thema: Link aufklappen vom 25.06.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Link aufklappen
Seite: 1, 2  Weiter
Autor Nachricht
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst Do 25.06.2009 07:59
Titel

Link aufklappen

Antworten mit Zitat Zum Seitenanfang

Guten Morgen!

Wie kann ich am besten durch einen Klick auf sagen wir "Mehr zeigen"
einen Text aufklappen? Hatte schon eine Lösung mit CSS gefunden, die aber nicht so richtig im Firefox funzt...Außerdem stört mich dieser Focus auf den angezeigten Sachen mit der CSS-Lösung...gibts da eine bessere Möglichkeit mit Javascript?

Vielen Dank und lg
 
DesignKater

Dabei seit: 26.06.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Do 25.06.2009 08:14
Titel

Antworten mit Zitat Zum Seitenanfang

Mit JQuery geht das ganz easy.

Code:

<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
   //bei Klick auf den Link mit id showbox
   $('#showbox').click(function() {
      //blende div mit id box aus und wieder ein ('dauer') #dauer =Millisekunden oder slow/normal/fast
      $('#box').slideToggle(300);
   });
});
</script>


Code:

<a href="#" id="showbox">Click me</a>
<div id="box">
Dein aufzuklappender Text.
</div>


Zuletzt bearbeitet von DesignKater am Do 25.06.2009 08:15, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
Anzeige
Anzeige
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst Do 25.06.2009 08:40
Titel

Antworten mit Zitat Zum Seitenanfang

danke für die antwort!

irgendwie wird das was nicht angezeigt werden sollte trotzdem angezeigt...
Code:

<a href="#" id="showbox" style="padding-left:10px;"><b style="color:#cf2817;">mehr Termine...</b></a>
<div id="box">
mein text

</div>


wenn ich die seite aufrufe sieht man "meintext". muss ich noch irgendwas im stylesheet ändern oder so?
habe jetzt nur den o.g. code im body eingefügt und das dadrüber im head.
 
DesignKater

Dabei seit: 26.06.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Do 25.06.2009 08:53
Titel

Antworten mit Zitat Zum Seitenanfang

Du musst der box ein display:none verpassen damit sie am Anfang unsichtbar ist.
  View user's profile Private Nachricht senden
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst Do 25.06.2009 08:58
Titel

Antworten mit Zitat Zum Seitenanfang

gut, jetzt hat die box im stylesheet dieses bekommen...

Code:
#box

   display:none;
}


jetzt ist der text "mein text" zwar ausgeblendet, aber wenn ich auf "mehr termine" klicke passiert nix, d.h. der gewünschte text blendet sich nicht ein...weder im ie noch im firefox *Schnief*
 
DesignKater

Dabei seit: 26.06.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Do 25.06.2009 09:02
Titel

Antworten mit Zitat Zum Seitenanfang

Google mal nach jquery-1.3.2.min.js und lad es dir runter und packt das in dein Projektverzeichnis. Und den Pfad in deiner HTML-Datei entsprechend anpassen nicht vergessen falls du die JS-Datei in einem Unterverzeichnis hast. Du brauchst natürlich die JQuery Bibliothek damit das ganze auch funzt.

Zuletzt bearbeitet von DesignKater am Do 25.06.2009 09:03, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst Do 25.06.2009 09:08
Titel

Antworten mit Zitat Zum Seitenanfang

super danke! darüber habe ich nicht nachgedacht.
funzt jetzt! Lächel
 
firewing

Dabei seit: 16.03.2010
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 16.03.2010 14:10
Titel

Antworten mit Zitat Zum Seitenanfang

Bin wegen Eurer Diskussion hier mal gelandet!

Code:

<a href="#" id="showbox" style="padding-left:10px;"><b style="color:#cf2817;">mehr Termine...</b></a>
<div id="box">
mein text

</div>


Das kann ich jetzt ja nur einmal auf Grund des JavaScripts verwenden. Wenn ich X Showboxen haben möchte, was mache ich dann? Wie muss ich das JavaScript ändern? Bin in JS nicht so bewandert. Danke für Eure Mühe!
  View user's profile Private Nachricht senden
 
Ähnliche Themen vertikale Navigation zum aufklappen
Navigation aufklappen und zuklappen
Zu langsames Aufklappen der MenuBar
suche tutorial > aufklappen .. zuklappen ...
Illustrator: Unterebenen nicht aufklappen
Dynamisches HTML - Formulare weiter aufklappen
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


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.