Beste,

Op een aantal websites heb ik het nu gezien ( weet alleen niet welke ).
Als je een actie uitvoert, dat er een klein venster komt ( over de pagina heen ) en dat je op de pagina zelf nergens meer op kan klikken totdat je het venster weg klikt.

Het gebeurt volgens mij met JavaScript....

Mvg,

Erik
Voor IE is er een functie die window.showModalDialog heet. Voor FF zou ik het uit mijn hoofd niet weten.
gooi 1 grote div over de pagina heen, en dan nog een kleintje, als er op OK wordt gedrukt laat je d.m.v. javascript beide div's weer verdwijnen.

Er zijn ook hele uitgebreide script op internet te vinden, weet zo niet waar, zal morgen even zoeken
tja,

Ik denk dat ik het niet goed uitleg...

Stel:
ergens op de pagina staat een linkje, als ik hier op klik moet over de totale pagina een soort van fade effect komen en een klein venstertje in het midden van de pagina met tekst erin. Het enige wat moet kunnen is klikken in dat kleine venstertje. pas als ik in het venster op de OK knop o.i.d. klik, moet de totale pagina weer klikbaar / scrollbaar enz enz zijn.

Ik hoop dat jullie begrijpen wat ik bedoel :)
Voor de mensen die het kennen zullen hopelijk begrijpen wat ik bedoel.

Mvg,

Erik
@ simon,

zo bedoel ik het indd :)
Ik heb hetzelfde principe als phpNewbie gebruikt. Één grote div om alles onklikbaar te maken en een transparante donkere kleur te krijgen en dan een klein divje wat het venstertje moet voorstellen. En met javascript kun je deze divs laten zien of verbergen. Broncode is zo te zien op http://portfolio.saimen.nl
Ik doe het ook in mijn chatbox.

Deze functie gebruikte ik er zo te zien voor:

function blackout(state)
{
	if((state == null || state == 'hide') && document.getElementById('blackout'))
	{
		document.getElementById('blackout').parentNode.removeChild(document.getElementById('blackout'));
	}
	else if((state == null || state == 'show') && !document.getElementById('blackout'))
	{
		var blackout = document.createElement('div');
			blackout.className = 'blackout';
			blackout.id = 'blackout';
			var handleClick = function()
			{
				document.getElementById('blackout').parentNode.removeChild(document.getElementById('blackout'));
			}
			addEvent(blackout, 'click', handleClick);
		document.getElementsByTagName('body')[0].insertBefore(blackout, document.getElementsByTagName('body')[0].firstChild);
	}
	return;
}


De functie addEvent is deze:

function addEvent(obj, eventType,fn, useCapture)
{
	if (obj.addEventListener) {
		obj.addEventListener(eventType, fn, useCapture);
		return true;
	} else {
		if (obj.attachEvent) {
			var r = obj.attachEvent("on"+eventType, fn);
			return r;
		}
	}
}


en dit is het stukje css:

.blackout{
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: .8;
    filter: alpha(opacity=80);
	background-color: black;
	
	font-family: Verdana;
	font-size: 20px;
	text-indent: 40%;
	color: white;
	algin: center;
	vertical-algin: middle;
}


De popup kan je vast zelf wel maken. Je moet er gewoon voor zorgen dat hij lager in de DOM-tree staat, of misschien dat z-index ook wel helpt. Anders komt hij eronder.

Reageren