Stadtinformationen anzeigen.

Stef

Hallo,

ich habe auf meiner Homepage eine Karte, einen div mit background-image die Karte als Hintergrund, dann später weitere divs id city auf der Karte absoulute positioniert, so als Markup. Später dann den divs id city dem :hover effekt gegeben um beim mouseover den div id city_informationen anzuzeigen.

Also div id city und in dem div id city_informationen.

mit visibility:hidden versteckt und bei mousover :hover visible zum zeigen der Infobox zu der Stadt eingeblendet.

Jetzt möchte ich aber das es bei klick auf den div id city der innere div id city_informationen erscheint, eben die Infobox zu der Stadt.

Wie kann ich das am besten mit Javascript lösen?, muss ich komplett umstellen ? ich komme nicht weiter ...

Sempervivum

Auch das sollte mit classList.toggle gut zu machen sein. Mit Javascript die Klasse hinzufügen/löschen und mit CSS die Sichtbarkeit des zusätzlichen Divs steuern.

Es gibt auch eine sehr gute Bibliothek namens Tooltipster, die man vorteilhaft einsetzen kann. Vorteil dabei: Die Position des Tooltip wird intelligent fest gelegt, d. h. ist das Element am oberen Rand des Fensters, wird der Tooltipp darunter angezeigt, am unteren Rand anders herum, links und rechts analog.

Jetzt mitmachen!