Computerhilfen.de Logo
Forum
Tipps
News

HTML CODE __ Wie mache ich das nur?

Hey,

ich suche eine HTML CODE für folgendes:

es steht eine NAME auf der website, und wen man jetzt mit der maus drüber fährt, soll ein bild neben der maus erscheinen, mit dem geischt der person

die bilder habe, die namen auch, aber wie mache ich das so zusammen, ohne neues fenster etc

bitte um hilfe!!


Antworten zu HTML CODE __ Wie mache ich das nur?:

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Das ist z.B. mit einem CSS-Pup-Up-Fenster möglich.

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button
Das ist z.B. mit einem CSS-Pup-Up-Fenster möglich.
Was ist ein Pup-UP? Etwas unanständiges? Davon abgesehen möchte der TO kein neues Fesnter öffnen.

Tipp an TO: Dein Suchbegriff heisst: "Bildwechsel bei Mouseover". Statt dem in dieser Funktion angegeben 1. Bild setzt Du den Text als "Over"-Link. Das geht mit CSS oder mit JavaScript.

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Sorry, es sollte Pop-Up-Fenster oder zu deutsch "Aufgeh-Fenster" heißen. Es öffnet sich dadurch keine neue Seite, sondern es wird ein größenmäßig definierter Bereich beim Hovern eingeblendet. Ist nichts unanständiges.
Vorteil der CSS-Lösung: Sie funktioniert auch, wenn Javascript deaktiviert ist.
Nachteil: Etwas sehr aufwändig zu coden.

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button
Aufgeh-Fenster ist nett, dass muss ich mir merken *g*

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

... wir sollten überhaupt mehr deutsche Begriffe verwenden:
http://www.reinhard-pfaffenberg.de.vu/  ;D

Schön das ihr mir so vielseitige vorschläge gebt, aber ich habe keine ahung wie ich das umsetzen soll.

Ich habe 2 mal ein css geöffnet. 1mal ausversehen und das 2temal habe ich damit irgendwie die ganze seite ruiniert.

Ich glaube das mit den css pop up fenster ist dsa was ich suche, ich lese es gerade. Ähhmm, okay. Mein free layout hat eine css datei und in den html daiten kein "style"

Dh ich kopiere den css code von der webiste in meine css datei und dan den html code an meinen NAMEN, benenne mein bild und schick ist?!

Das ist mir doch echt zu hoch?! 

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Gibt es einen Link?
Wenn eine CSS-Datei vorhanden ist, wird auf den entsprechenden HTML-Seiten normalerweise darauf verwiesen.
Kommt jetzt drauf an, wo du das haben willst.

Zum Test lade dir am besten deine Online-Dateien auf den PC. Erstelle vorsichteshalber eine sicherungskopie.

In die CSS-Datei fügst du den CSS-Code ein und in die HTML-Datei den HTML-Code. Dann ausprobieren und wieder hochladen.
 

also:

http://www.friedels-home.com/index.htm?/Board/viewtopic.php?t=400

hier von ausgegangen: habe ich jetzt folgende codes in meiner css:

a.info span{display: none;
background-image: url(../images/test.jpg);
}

a.info:hover span{
    display:block;
    position:absolute;
    top:2em; left:2em; width:200px;height:200px;
    border:1px solid #0cf;
 color:#000;
    text-align: center}

DARAUF HIN:
habe ich dann in meine html datei [bzw txt, zum bearbeiten] einfach mal das kopiert:

<a class=info href="#">Hier soll beim Drüberfahren ein Info-Fenster erscheinen <span>Hallo, ich bin das Info-Fenster, hier kannst du Infos reinschreiben</span></a>

Es passiert foglendes, wen man die html datei mit den fircefow brwoser öffnet:

man sieht den gesamten text als link [gelb unterstrichen] sowhl "hier soll beim .." als auch "hallo, ich bin" fährt man über "hier soll beim" erscheint ganz links oben in der site ein blauer nicht ausgefüllter kasten [200x200] ohne das mein weißes 200x200 test-jpg zu sehen ist. Es verschwindet solagne der katen zu sehen ist und die maus über dem "hier soll beim." der andere teil mit den "hallo .."
 
Fährt man mit der Maus über das "hallo, ich bin" erscheint der blaue katen wieder unausgefüllt und beides fängt an zu blinken [schnell, eher eine art zitteren] weiß nciht wie ich es besser beschreiben soll

Was habe ich nun wieder falsch gemacht??



ps. toll wäre es wen das bild in der mitte der website oder neben der maus auftauchen könnte. Und auch ohne text, im bild.

Ich hoffe auf hilfe und danke im voraus
 

sry wegen dem doppelpost aber der satz oben mit den "es verschwindet ..." sol heißen.

Solange man mit der maus über dem "hier soll beim.." hält, und damit der blaue unausgefüllt kasten ja ist, ist das "hallo, ich...." verschwunden.

Lg

HILFE!

DANKE!

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Ja, das funktioniert nur so lange, wie du mit der Maus über den Link fährst.
Probiers mals so:
CSS

a.info span{display: none;
background-image: url(../images/test.jpg);
}

a.info:hover{z-index:2; background-color:#ff0}

a.info:hover span{
    display:block;
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-100px;
    margin-top:-100px;
     width:200px;height:200px;
    border:1px solid #0cf;
 color:#000;
    text-align: center}

HTML
<a class=info href="#">Hier soll beim Drüberfahren ein Info-Fenster erscheinen <span></span></a>
Falls das Bild nicht erscheint, überprüfe mal den Pfad.
Wenn es 200 x 200 px hat, sollte es in der Bildschirmmitte erscheinen.

DANKE DANKE DANKE!!!!

*sich verbeug*

DANKE!!!!

ihr seit einfach klasse!!


*freu* nochmal vielen dank

aber eine frage noch: was muss ich an werten veränderen wen es weiter nach unten soll? [alos nicht ganz nach utnen nur ca. 200 pixel]



 

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button
margin-top:-100px;Diesen Pixelwert musst du verändern.
200px nach unten entspricht dann margin-top:100px;, hier dann also +100px

Die Margin-Werte gehen im Ursprungscode immer exakt von der Bildschirmmitte aus (top/left:50%).
Zur Erklärung siehe http://www.friedels-home.com/index.htm?/Board/viewtopic.php?t=562

SUPER thx

was mache ich eig wen ich jetzt noch eins davon möchte??

also ein andere Name mit einem anderen Bild??

wie ändere ich das dann um?? und wo??

in der css etwa "b.info" und dann irgendwas im html code reinschreiben??


[es werden ca. 5-7 solcher sachen benötigt]


ps. das erste funktioniert bereits wunderbar. sieht genial aus, einfach spitze, hätte ich nie ohne dich(prm)/euch geschafft

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Bei mehreren Bildern darfst du leider nich alphabetisch fortfahren, denn "a" ist reserviert für den Link und darf deshalb nicht verändert werden.

Am besten koperst du alles. Dann überall wo "info" steht ersetzen durch eine andere Bezeichnung, z.B. "info1"
Sowohl im CSS als auch im HTML-Teil. Dann jeweils noch ein anderes Bild hinterlegen.
Wenn das z.B. Personen sind, könntest du genauso gut auch deren Namen nehmen und damit "info" ersetzen.


« protokollieren von aktiven Server-Verbindungen mittels htaccess => PHPSoftware zur Homepage-Erstellung »
 

Schnelle Hilfe: Hier nach ähnlichen Fragen und passenden Tipps suchen!