• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Aufkapp-Effekt bei News/Texten

S

Steelbound

Neues Mitglied
Edit: In der Überschrift sollte 'Aufklapp', nicht 'Aufkapp' stehen ;)

Hey liebe Leute!
wir haben auf unserer Seite www.powermetal4ever.de.tl , gleich auf der Startseite eine 'News'-Sektion. diese News sind immer sehr lang, und das ist teils sehr nervig zum runterscrollen.
Schaut mal, dann seht ihr, was ich meine.
Das hätte ich gerne kürzer, das heißt: Ich würde den Artikel gerne 'verstecken', sodass der sich erst nach unten aufklappt, wenn man auf 'alles lesen' oder so klickt.
Als Beispiel:
Ein Youtube-video. die beschreibung ist sehr lang. dann kommt sowas (als Beispiel mal ein Song, die Lyrics sind in der Beschreibung):
___________________________________
(Weitere Informationen)

Lyrics: I have come to unfold your mind in my veins runs the poison wild in the streams of mountains I flow I have opened the doors for unleashed and endless hate it will burn like the raging green...
___________________________________

Wenn man auf 'Weitere Informationen' klickt, kommt dann der gesamte Text.
Und genau sowas möchte ich mit den Artikel in den News haben. Und dass man dann natürlich 'weniger Infos' klicken kann, damit das wieder verschwindet. Und, genau, wie bei Ytube, würde ich gerne die ersten paar Wörter/Sätze da stehen haben, damit der LEser weiß, worum es geht.

Puh, ich hoffe, dass das reicht
icon_wink.gif


Beste Grüße und vielen Dank im voraus!!!
 
Zuletzt bearbeitet:
Bin noch ziemlicher Anfänger in solchen Sachen...
könntest du das ein wenig genauer erklären, bitte? ;)

Am besten mit einem Beispiel...was muss ich wo einfügen und wie, um diesen Text verschwinden zu lassen:

Schauspieler Christopher Lee, dem älteren Publikum für seine Rollen als Dracula, den er insgesamt in 9 Filmen verkörperte, sowie als Bond Bösewicht Francisco Scaramanga aus Der Mann mit dem goldenen Colt und beim Jüngeren Publikum als Sith Lord Count Dooku aus den Starwars Episoden II und II und Saruman aus der Herr Der Ringe Trilogie bekanbnt, hat angekündit, dass er am 15.03. ein Symphonic Metal Konzept Album Namens "Charlemagne" veröffentlichen will.

Vielleicht dann einfach mal vormachen, dann versteh ichs ;)
Schonmal vielen Dank für deine Mühe!!!
 
Sicher nicht der Weisheit letzter Schluss:

Edit: jQuery macht vieles komfortabler.

Code: 
<!DOCTYPE html>

<html>
    <head>
        <title>Demo</title>
        <meta http-equiv="charset" content="utf-8" />
        <style type="text/css">
            body {
                background: #ccc;
            }

            #teasers p {
                border: 1px solid #999;
                padding: 2px;
                background: #fff;
                cursor: pointer;
            }
        </style>
        <script type="text/javascript">
            //<[CDATA[
            var map = new Array();

            function contract()
            {
                this.innerHTML = this.innerHTML.substr(0, 80) + "...";
                this.onclick = expand;
            }

            function expand()
            {
                var i = 0;

                while (map[i]['elementRef'] != this) {
                    i++;
                }

                this.innerHTML = map[i]['originalContent'];
                this.onclick = contract;
            }

            window.onload = function()
            {
                // Alle p-Tags in #teasers
                var elements = document.getElementById('teasers')
                                       .getElementsByTagName('p');

                for (var i = 0; i < elements.length; i++) {
                    // Langversionen der Teaser-Texte sichern
                    map[i] = {'elementRef'      : elements[i],
                              'originalContent' : elements[i].innerHTML};

                    // Anfangsstatus: Kurzversion
                    elements[i].onclick = contract;
                    elements[i].onclick();
                }
            }
            //]]>
        </script>
    </head>
    <body>
        <div id="teasers">
            <p>Schauspieler Christopher Lee, dem älteren Publikum für seine Rollen als Dracula, den er insgesamt in 9 Filmen verkörperte, sowie als Bond Bösewicht Francisco Scaramanga aus Der Mann mit dem goldenen Colt und beim Jüngeren Publikum als Sith Lord Count Dooku aus den Starwars Episoden II und II und Saruman aus der Herr Der Ringe Trilogie bekanbnt, hat angekündit, dass er am 15.03. ein Symphonic Metal Konzept Album Namens "Charlemagne" veröffentlichen will.</p>
            <p>District 9 is a 2009 science fiction-action film directed by Neill Blomkamp, written by Blomkamp and Terri Tatchell, and produced by Peter Jackson. The film stars Sharlto Copley, Jason Cope, and Robert Hobbs. Copley plays the role of Wikus van de Merwe,[3] a South African bureaucrat assigned to relocate a race of extraterrestrial creatures, derogatorily referred to as "prawns", from a refugee camp in Johannesburg to a new one outside the city.</p>
            <p>Solaris is a 2002 science fiction film directed by Steven Soderbergh and starring George Clooney. It is based on the science fiction novel by Polish writer Stanisław Lem (which also inspired the critically acclaimed 1972 Soviet film of the same name, directed by Andrei Tarkovsky, and a 1968 TV film).</p>
        </div>
    </body>
</html>
 
Hey, vielen vielen Dank!
Hat mir wiklich weitergeholfen!
Das einzige wäre jetzt noch, den Hintergrund der Kästen schwarz zu machen.
Ich hab mal ne kleine Test-Seite gemacht: - Titel der neuen Seite

Weil wir einen schwarzen BG haben, kann man das nicht lesen, und weiß auf weiß ist sowieso doof :P
Wäre nett, wenn jemand den Code dahingehend umschreiben könnte (aus meinen bisherigen Erfahrungen würd sagen, das geht ganz schnell)

Nochmal VIELEN Dank!

Edit: auch noch das Beispiel mit nur einem Aufklapp-Teil, also ohne die beiden anderen Filme bitte, da wir die News einzeln und nicht am Stück eintragen! ;)
 
Zuletzt bearbeitet:
Hi,
ich fänds richtig cool, wenn du einen mouseover bei den Buttons reinsetzen würdest!!
Außerdem fänd ichs richtig cool wenn dann der Button eine bestimmte farbe / kontrast
hätte, damit man sieht wo man gerade ist!!
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben