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

Script für Textfade

F

Friction

Neues Mitglied
Hidiho,

ich hab folgendes Problem: ich habe auf meiner Seite 7 Objekte, jedes mal wenn ich über eines mit dem Mauszeiger fahre, soll oben drüber eine Sprechblase erscheinen, in der je nach Objekt ein anderen Text anzeigt.

Ich hab nach FadeIn und FadeOut gesucht, bei den Tutorials waren es aber jedes mal buttons, die den Effekt aktiviert haben - er soll aber aktiviert werden, sobald man über eines der Objekte fährt.

Ich finde einfach kein passendes Script und brauche Hilfe, die Seite muss heute fertig werden =/

Schonmal danke!
 
Hi mermshaus,

nach diesen Begriffen hab ich auch schon gegoogelt, aber der Effekt ist nicht so, wie ich mir erwünscht hatte. Das Tooltip soll nicht mit dem Mauszeiger mitgehen, sondern die Sprechblase soll eine feste Größe, Position und Hintergrund haben.
 
Friction schrieb:
nach diesen Begriffen hab ich auch schon gegoogelt, aber der Effekt ist nicht so, wie ich mir erwünscht hatte.
Zum Vergrößern anklicken....
Der Effekt des googlen? Woher sollen wir Wissen, was du dir wünscht und woher sollen wir Wissen, was deinen Wünschen nicht entspricht?
Du musst schon konkreter Antworten.
 
Zuletzt bearbeitet von einem Moderator:
Ja, sowas dürfte leicht mit soetwas gehgen, was du mit Hilfe der Suchbegriffe gefunden hast.
 
Ja, das ist der Grund warum ich mich hier angemeldet hab und diesen Thread geöffnet habe. Ich finde nichts was mir nützt und mein Verständnis für JS liegt bei 0, kann da absolut kein logisches Eigendenken entwickeln. Nichtsdestotrotz muss ich bis heute abend die Seite fertig haben und bitte euch um Hilfe :(
 
Friction schrieb:
Ja, das ist der Grund warum ich mich hier angemeldet hab und diesen Thread geöffnet habe. Ich finde nichts was mir nützt und mein Verständnis für JS liegt bei 0, kann da absolut kein logisches Eigendenken entwickeln. Nichtsdestotrotz muss ich bis heute abend die Seite fertig haben und bitte euch um Hilfe :(
Zum Vergrößern anklicken....
Hilfe ist ja schön und gut. Aber bei was? Beim suchen, beim einbauen, beim entwickeln, beim umsetzen .... ???
Hier ist ein Forum, Wir sitzen nicht neben dir und können dir über die Schulter schauen, d.h. wenn DU willst, dass WIR dir helfen, musst du uns in die Lage dazu versetzen.

Und ich find es auch selbstverständlich, wenn man von anderen Menschen Hilfe erwartet, die nebenbei bemerkt auch umsonst ist, zumindest eine minimale Eigeninitiative entwickelt. Aber bei solchen Aussagen wie "es muss bis heute abend fertig sein", befürchte ich du stellst dir hier etwas anderes vor.
 
Sry, wenn ich mich undeutlich ausgedrückt habe.
Also wie auf meiner Skizze zu sehen ist, geht es darum, dass die Sprechblase oben, also mit anderen Worten eine Box, erscheinen soll, sobald man über eine Person fährt.
In dieser Box sollen Dinge drinstehen wie Name, Hobby etc und noch ein Profilbild.

Hilfe bräuchte ich beim einbauen und beim entwickeln. Die Box soll ein background-image haben, bei der ich eben ein Bild einbinde, dass ausschaut wie eine Sprechblase.
Ich weiß natürlich dass es nicht selbstvertändlich ist, dass ihr mir helft, wäre aber sehr dankbar.

Also wenn es irgendwie geht, könnte mir jemand den Code schreiben? Am liebsten wäre es mir, wenn wir das per JavaScript schaffen.

Also bräuchte ich die Java Definiton in der head-Zeile und dann das Script für das Bild der Person, bei dem wir einstellen, dass beim hover die Box oben erscheint und wieder verschwindet wenn man den Mauszeiger von der Person bewegt. Und natürlich noch das Script für die Box selbst.

Danke

/edit: die Breite der Box und die Namensgebung der Divs ist ja erstmal egal, mir geht es nur um die Programmierung
 
Hilfe bräuchte ich beim einbauen und beim entwickeln.
Zum Vergrößern anklicken....

Und was kannst du alleine?

Java ist nicht JavaScript. Den Code hat dir schon jemand geschrieben, nämlich der Entwickler des jeweiligen Tooltip-Scripts. Du brauchst es lediglich noch in deine Seite einzubinden, anzupassen und deine entsprechenden Inhalte einzufügen.

Wie das alles genau geht, steht in der Dokumentation haarklein erklärt.

Unten folgt ein Beispiel.

Ansonsten wende dich bitte an die → Jobbörse

Sowas noch "Hilfe" zu nennen, grenzt an eine Lüge.

Code: 
<!DOCTYPE html>

<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>New</title>
        <script type="text/javascript" src="jquery-1.3.2.js"></script>
        <script type="text/javascript" src="jquery.qtip-1.0.0-rc3.min.js"></script>

        <script type="text/javascript">
        $(document).ready(function() {
            addTooltip('#test',
                '<img src="http://www.google.de/images/logos/ps_logo2.png">\n\
                <p>Hier steht Inhalt.</p>');
            addTooltip('#test2',
                '<img src="http://www.google.de/images/logos/ps_logo2.png">\n\
                <p>Hier steht Inhalt.</p>');
        });

        function addTooltip(element, content)
        {
            $(element).qtip({
                content: content,
                style: {
                    width: 400,
                    padding: 5,
                    background: '#fff',
                    color: 'black',
                    textAlign: 'left',
                    border: {
                        width: 3,
                        radius: 5,
                        color: '#ddd'
                    },
                    tip: 'bottomLeft',
                     // Inherit the rest of the attributes from the preset dark style
                    name: 'dark'
                },
                position: {
                    corner: {
                        target: 'topMiddle',
                        tooltip: 'bottomLeft'
                    }
                }
            });
        }
        </script>

        <style type="text/css">

            #test {
                width: 200px;
                background: red;
            }

            #test2 {
                width: 200px;
                background: green;
            }

        </style>
    </head>

    <body>
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>
        
        <div id="test">Test</div>
        
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>
        <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text.</p>

        <div id="test2">Test2</div>
    </body>

</html>
 
Ich weise mal wieder dezent darauf hin, dass der Ton des Gesagten im Internet nicht mit übertragen wird.

Es ist so: In diesem Thread wurden bisher nur Arbeitsaufträge ohne erkennbaren Willen zur Eigenbeteiligung formuliert, obwohl genug Chancen dazu eröffnet wurden, eigene Ansätze finden zu können. Das mag gar keine böse Absicht sein, aber das ändert nichts an der Tatsache.

Was hier (unter Zeitdruck) gewünscht wird, ist keine "Hilfe" im Sinne eines unterstützenden Anleitens, sondern vielmehr das Anfertigen einer schlüsselfertigen Arbeit.

Den Wunsch habe ich übrigens vor dem Hintergrund der gegebenen Informationen sogar nach bestem Wissen erfüllt. Das ist eigentlich unangebracht. Da wird zumindest ein kleiner Hinweis erlaubt sein, hoffe ich.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben