Scripts - Tutorials - Forum - Downloads - Showcase - Contact

Artikels

VPN vergelijken

Algemeen

Beginpagina

FAQ

Grafische worm (243)

Links

Nieuwsartikels

Nieuwsarchief

Boeken programmeren

Overzicht

Samenwerken

Webhosting

Zoek op Sitemasters

Leden

Registreren

Ledenlijst

Ons team

Links

webhostingtop10.be

Sociale media

Follow @sitemasters

Sitemasters

Adverteren op Sitemasters?

Contacteer ons

RSS

Link naar ons

Donaties

Poll

Je moet ingelogd zijn om te stemmen.

Statistieken

Linkpartners

Forum

Categorieën > HTML & CSS

onclick scherm weg (Opgelost)

JeroenI - 06/03/2013 18:34

PHP interesse

Hallo,

Met onderstaande code kan ik wel een scherm met onclick naar voren halen, maar er staat een kruisje (x-icon.png) welke het ook weer zou kunnen sluiten maar hij wil niet sluiten. Voor alle duidelijkheid, $i gebruik ik om meerdere div's met aparte id te identificeren.

php code - Bekijk de code zonder highlighting - Klap code in

echo '<div onclick="document.getElementById(\'tabmenu'.$i.'1\').style.display=\'\'">';
echo '<a href="#">Reacties:'.$reactienum.'</a>';
echo '<div style="clear: both;"></div>';
echo '<div style="position:relative;">';
echo '<div id="tabmenu'.$i.'1" style="display:none; width:200px; height:200px; border-style:solid; border-width:2px; border-color:#000000; padding:2px; background-color:#4c4c1d; float:left; position:absolute; left:-150px;">';
echo '<div align="right"><a href="#"><img src="x-icon.png" height="15" border="0" onclick="document.getElementById(\'tabmenu'.$i.'1\').style.display=\'none\'"></a></div>';
echo '</div></div>';
echo '<div style="clear: both;"></div>';
echo '</div>';

echo '<div onclick="document.getElementById(\'tabmenu'.$i.'1\').style.display=\'\'">';
echo '<a href="#">Reacties:'.$reactienum.'</a>';
echo '<div style="clear: both;"></div>';
echo '<div style="position:relative;">';
echo '<div id="tabmenu'.$i.'1" style="display:none; width:200px; height:200px; border-style:solid; border-width:2px; border-color:#000000; padding:2px; background-color:#4c4c1d; float:left; position:absolute; left:-150px;">';
echo '<div align="right"><a href="#"><img src="x-icon.png" height="15" border="0" onclick="document.getElementById(\'tabmenu'.$i.'1\').style.display=\'none\'"></a></div>';
echo '</div></div>';
echo '<div style="clear: both;"></div>';
echo '</div>';

Alvast bedankt!

4 antwoorden

Gesponsorde links

Jointjeff - 06/03/2013 19:23 (laatste wijziging 06/03/2013 19:23)
HTML interesse		Heb je met Inspect Element (Chrome) of Firebug (Firefox) gekeken of er wel iets gebeurt? Kan je vervolgens de gehele even plaatsen op plaatscode? Dan kan ik het beter nakijken.

JeroenI - 06/03/2013 19:35 (laatste wijziging 06/03/2013 19:37)
PHP interesse		Hoe gebruik je Firebug? Trouwens, dit is de code, de rest van html er omheen is helemaal niet relevant. Hij opend de popup wel, maar op het plaatje sluit hij hem gewoon niet.

Jointjeff - 06/03/2013 21:02 (laatste wijziging 06/03/2013 21:03)

HTML interesse

Het gaat mis omdat je de onclick op een omliggende div hebt staan. Daardoor klik je daar automatisch altijd op en voert hij altijd de display:block functie uit.

Probeer dit maar eens:

php code - Bekijk de code zonder highlighting - Klap code in

echo '<div>';
echo '<a onclick="document.getElementById(\'tabmenu'.$i.'1\').style.display=\'block\'" href="#">Reacties:'.$reactienum.'</a>';
echo '<div style="clear: both;"></div>';
echo '<div style="position:relative;">';
echo '<div id="tabmenu'.$i.'1" style="display:none; width:200px; height:200px; border-style:solid; border-width:2px; border-color:#000000; padding:2px; background-color:#4c4c1d; float:left; position:absolute; left:-150px;">';
echo '<div align="right"><a href="#"><img src="x-icon.png" height="15" border="0" onclick="javascript:document.getElementById(\'tabmenu'.$i.'1\').style.display=\'none\'"></a></div>';
echo '</div></div>';
echo '<div style="clear: both;"></div>';
echo '</div>';

echo '<div>';
echo '<a onclick="document.getElementById(\'tabmenu'.$i.'1\').style.display=\'block\'" href="#">Reacties:'.$reactienum.'</a>';
echo '<div style="clear: both;"></div>';
echo '<div style="position:relative;">';
echo '<div id="tabmenu'.$i.'1" style="display:none; width:200px; height:200px; border-style:solid; border-width:2px; border-color:#000000; padding:2px; background-color:#4c4c1d; float:left; position:absolute; left:-150px;">';
echo '<div align="right"><a href="#"><img src="x-icon.png" height="15" border="0" onclick="javascript:document.getElementById(\'tabmenu'.$i.'1\').style.display=\'none\'"></a></div>';
echo '</div></div>';
echo '<div style="clear: both;"></div>';
echo '</div>';

Toch even deze tip/suggestie: Plaats je CSS in een apart bestand. Dit komt de overzichtelijkheid ten goede. Of je er wat mee doet moet je natuurlijk zelf weten ;)

Bedankt door: JeroenI

JeroenI - 08/03/2013 12:19
PHP interesse		Top! Het werkt als een trein. bedankt!

Gesponsorde links

Je moet ingelogd zijn om een reactie te kunnen posten.

Actiefste leden van de maand

Actieve forumberichten