Html Probleme silde Funktion

Hallo,

Folgendes Problem:
Ich bin gerade dabei einen Blog aufzubauen. Diese Informationen sollen per Mausklick „aufsliden“, wie geht das?

Sollte genauso Funktionieren wie hier:

http://interim-site-3.mariolombardo.com/news.html

ich arbeite ausschließlich mit html codes. Um es genauer zu sagen habe ich auch keine großen Kenntnisse.

Hallo,
die Seite nutzt Javascript für diesen Effekt. Wenn man Javascript ausgeschaltet hat (was aus Sicherheitsgründen sinnvoll ist) sieht man auf der Seite auch keine Artikel. Nicht besonders benutzerfreundlich.

Mit HTML und CSS sind keine Animationen möglich.

Gruß

Hallo,

Ja das habe ich mir gedacht, habe leider aber die Aufgabe bekommen dies trotz der Probleme zu tun ! Ist das ein Javascribt? Wenn ja gibt es da schon irgendwelche Vorgaben ? :smile:

Gruß

Tut mir leid, mit Javascript kenne ich mich auch nicht aus.

Aber im CSS3 gibt es wohl auch etwas, was helfen könnte.
30 Sekunden mit Google brachte das hier zu Tage, vielleicht hilft’s dir ja. Viel Erfolg!

http://webstandard.kulando.de/post/2010/03/05/css3-t…

Hallo Marc,

ich nehme mal zwei Dinge an: 1. Du willst mit Wordpress arbeiten. 2. Der Link
bezieht sich auf eine Beispielseite.

Wenn beides zutrifft: Die Beispielseite verwendet laut Quellcode Slide-O-Matic
http://themes.wordpress-deutschland.org/slide-o-matic/ also ein Theme,
welches JavaScript verwendet.

Dieses arbeitet mit Widgets, die Du hinzufügen kannst. Welche genau es nutzt, das
müsstest Du im Theme selber ergründen.

Ich hoffe, dass ich Dir helfen konnte und wünsche Dir viel Erfolg beim Erstellen des
Blogs (korrekterweise übrigens DAS Blog, auch wenn DER Blog in letzter Zeit nicht
selten verwendet wird :wink: )!

Viele Grüße,

  • Lutz

PS: Wenn es geklappt hat, dann kannst Du mir gerne ein kurzes Feedback senden.

ich würde das problem mit javascript lösen:
dazu schreibst du in deinen header

(zwischen und )

var zauf01 = "0";
function auf01() {
 if (zauf01 == "0") {
 document.getElementById('unten01').style.display='block';
 document.getElementById('auf01').innerHTML='Schließen';
 zauf01 = "1";
 }
 else if (zauf01 == "1") {
 document.getElementById('unten01').style.display='none';
 document.getElementById('auf01').innerHTML='Lesen';
 zauf01 = "0";
 }
}


und in den body (zwischen und 

[Lesen](%23)



hier dein text der beim klicken auf "lesen" angezeigt werden soll

Hi,

nur mit HTML funktioniert das gar nicht, mit CSS3 und HTML5 ist das angeblich möglich, aber das ist eine neue Technik, in die ich mich noch nicht eingearbeitet habe. Ist auch ziemlich tricky und vor allem funktioniert es noch nicht in allen Browsern. Die Beispielseite, die du genannt hast löst das Problem über JavaScript. Wenn du selbst recherchieren willst empfehle ich http://jquery.com/ eine JavaScript Bibliothek, die vorgefertigte Funktionen für so etwas bietet und auch recht gute Anleitungen hat wie man die Skripte in die eigenen Seiten einbaut.
Ansonsten erkundige dich mal bei JavaScript-Experten.

Schönen Gruß,
Vistin

Hallo Marc,
Also ich wüsste jetzt nicht, dass so etwas mit rein HTML zu bewerkstelligen wäre. Da müsstest Du eher auf eine Kombination von css und javascript zurückgreifen. Ad hoc wüsste ich jetzt aber auch nicht wie ich das Thema angehen würde. Ich würde mich erstmal hinsetzen und mit Google schaun wie es andere Leute gemacht haben :wink: Bin da zum Beispiel gleich darauf gestossen
http://www.switchonthecode.com/tutorials/javascript-…
Evtl. hilft Dir das schon weiter. Wie ich mir gedacht habe eine Kombination aus css und javascript. Schau Dir auch mal die Pseudoklassen von css an. Ich denke damit müsste es auch funktionieren. In die css box die Aufklappen soll ein display:none und dann beim :hover eines Links zum Beispiel auf display:inline switchen.

PS: Wenn Du nicht all zu viel Arbeit reinstecken willst kannst Du auch auf ein Framwork zurückgreifen.
http://demos.mootools.net/Fx.Slide
Zum Beispiel :wink:

danke ! sobald ich was weiß melde ich mich ! DANKE

Hallo,

dieses „Aufsliden“ ist meist mit JavaScript umgesetzt.
Das gezeigte Beispiel ist mit folgenden System gebaut worden: http://themes.wordpress-deutschland.org/slide-o-matic/

Habe slide-o-matic noch nicht direkt verwendet, denke aber dass keine JavaScript-Kenntnisse erforderlich sind.

Wenn Dir dieser Vorschlag nicht weiterhilft kann ich noch die JavaScript-Library MooTools empfehlen, wo der Effekt unter „accordion“ auffindbar sein sollte.
-> http://demos.mootools.net/Accordion

Dieses „aufsliden“ das du implementieren möchtest ist in Javasctript realisiert.

was eventuell gehen könnte wäre mit css eine funtion einrichte, die bei einem Klick, den Beitrag mit dem z wert nach vorne zuheben… ähnlich wie wenn ein neues, kleineres Fenster aufgeht.

Hallo,

mit Html allein wirst du das nicht hinbekommen. Dafür braucht es schon etwas JavaScript. Am einfachsten geht es mit dem jQuery-Framework, hier ein Beispiel: http://docs.jquery.com/UI/Accordion

Gruß

Hallo,

Dieses Menü wurde mit JavaScript (genauer der Bibliothek JQuery) gestaltet.
Für Einsteiger könnte es etwas schwer sein, es so zu übernehmen, aber grundsätzlich sind alle Informationen über den Quelltext einsehbar.

Ich würde dir empfehlen, dich ein wenig mit JavaScript zu beschäftigen, um soetwas realisieren zu können.

Viel Erfolg!

Florian

Hi,

ist länger her, aber ich antworte doch noch mal eben, dachte ich.

Das ist eine coole und sehr praktische Funktion (finde ich), die leider Javascript voraussetzt. Schalte mal in deinem Browser JS aus uns, mach einen Reload und schau, was dann mit den Links passiert – gar nix.

Wenn man das in Kauf nehmen will (hat ja nicht jeder JS installiert bzw. aktiviert), kann man so etwas im Netz finden, zB hier:

http://www.randomsnippets.com/2008/02/12/how-to-hide…

Bissl HTML muss man dafür natürlich schon können, aber da die Skripte fertig sind, muss man immerhin kein JS verstehen.

Gruß
Dominik

Folgendes Problem:

Ich bin gerade dabei einen Blog aufzubauen. Diese
Informationen sollen per Mausklick „aufsliden“, wie geht das?

Sollte genauso Funktionieren wie hier:

http://interim-site-3.mariolombardo.com/news.html

ich arbeite ausschließlich mit html codes. Um es genauer zu
sagen habe ich auch keine großen Kenntnisse.