popup zonder kader

Status
Niet open voor verdere reacties.
James007

James007

Meubilair
Lid geworden
7 jan 2005
Berichten
5.794
Hoi,

Wat ik wil realiseren is dat als mensen een linkje aanklikken, er een popup opent met daarin de informatie. MAAR omdat ik tegen echte popupvensters ben, zou ik dit graag anders oplossen.

Websitevertaler WorldLingo heeft bij vertaling van een website steeds onderaan een boodschap staan in een venstertje met een klein zwart kruisje achter, dat kan je bijvoorbeeld hier zien.

Is het mogelijk om zelf zoiets te maken met Javascript of is er een javascript dat ervoor kan zorgen dat ik een paar regels informatie in dergelijk balkje kan weergeven?

James :)
 
Geplaatst door James007
Wat ik wil realiseren is dat als mensen een linkje aanklikken, er een popup opent met daarin de informatie. MAAR omdat ik tegen echte popupvensters ben, zou ik dit graag anders oplossen.
Klik om te vergroten...
Dat zou je met layers kunnen doen.
Layers kun je overal op de pagina zetten, je kunt er meerdere op elkaar plaatsen en je kunt ze naar believen zichtbaar of onzichtbaar maken - door een muisklik bijvoorbeeld.
Een layer kan van alles bevatten - tekst, afbeeldingen, links etc. En dus ook een kruisje waarop je kunt klikken om de layer weer onzichtbaar te maken. :)
Met Dreamweaver is het maken van layers een fluitje van een cent - zie bijlage.
Heb je een layer gemaakt, dan kun het gedrag (behavior) van de layer koppelen aan een gebeurtenis (event), een muisklik bijvoorbeeld.
Kijk ook hier maar eens tussen voor meer info.

Guus.
 
Laatst bewerkt:
Dankje guus:) Ik had het op de chat ook gevraagd en Japie82 heeft me daarbij geholpen. Dat van die layers was me duidelijk, maar om zelf die code te gaan maken... :o
Dit is het geworden:D

PHP: 
<html>
<head>
<style type="text/css">
<!--
#wl_disclaimer {
  display: none;
  position: absolute;
  left: 25%;
  bottom: 50%;
  border: dashed 1px #929292;
  background-color: #EEEEEE;
  text-align: center;
  padding: 1px;
  width: 50%;
  }
body > div#wl_disclaimer { position: fixed; }
-->
</style>
<script language="JavaScript" type="text/javascript">
  function wl_close_disclaimer() {
    document.getElementById('wl_disclaimer').style.display = 'none';
    document.getElementById('linkje').style.display = 'block';
  }
  function wl_show_disclaimer() {
    document.getElementById('wl_disclaimer').style.display = 'block';
    document.getElementById('linkje').style.display = 'block';
  }
</script>
</head>

<body>

	<div id="linkje">
		<a href="#" onClick="wl_show_disclaimer();">Laat blokje zien!</a>
	</div>

	<div id="wl_disclaimer">
	  <table width="100%" cellpadding="0" cellspacing="1" style="margin: 0px;font: normal 11px verdana,arial,sans-serif;color: #000000;">
	    <tr>
	      <td align="right" valign="top"><img src="http://i5.photobucket.com/albums/y185/jamesimage/close_disclaimer.gif" height="13" width="13" alt="Close Disclaimer" title="Close Disclaimer" style="cursor: pointer" onclick="wl_close_disclaimer()"/></td>
	    </tr>
	    <tr>
	    	<td>Hier kan je dan je eigen tekstjes plaatsen.<br><br>Een andere positie geven<br><br>Best leuk zo</td>

	    </tr>
	  </table>
	</div>
	
</body>
</html>

Tnx To Japie82! :love:

James:)
 
Laatst bewerkt:
Geplaatst door James007
maar om zelf die code te gaan maken... :o
Klik om te vergroten...
Ik moet er ook niet aan denken en zou het niet eens kunnen. :D
Gelukkig doet Dreamweaver dat voor me. :)

Guus.
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan