Autore Topic: Posizione modulo in lightbox a comparsa [RISOLTO] (Letto 3014 volte)

password · « **il:** 29 Nov 2010, 10:57:40 »

Buongiorno.
Vorrei creare una lightbox contenente il modulo di login di virtuemart ma non ho trovato nessuno script adatto in giro...ci sono solo pannelli in slide, io lo voglio che compare in dissolvenza al centro dello schermo.
Qualcuno sa dove posso trovare qualcosa di adatto?

p.s. in realtà non so se si può chiamare lightbox...io ho cercato con lightbox e popup box ma non ho trovato nulla di interessante..

Finalmente ho trovato qualcosa di utile: http://web-kreation.com/all/showhide-login-panel-using-mooslide-mootools-1-2/
L'unico problema è che il codice è troppo complesso...come posso modificarlo in modo tale da avere una position all'interno del pannello?

password · « **Risposta #1 il:** 01 Dic 2010, 17:33:14 »

Alla fine cercando e cercando ne ho trovati di diversi. I più interessanti sono:

anche se io ho risolto con questo piccolo script senza dover chiamare librerie varie:

Codice: [Seleziona]

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>LIGHTBOX EXAMPLE</title>
		<style>
		.black_overlay{
			display: none;
			position: absolute;
			top: 0%;
			left: 0%;
			width: 100%;
			height: 100%;
			background-color: black;
			z-index:1001;
			-moz-opacity: 0.8;
			opacity:.80;
			filter: alpha(opacity=80);
		}
		.white_content {
			display: none;
			position: absolute;
			top: 25%;
			left: 25%;
			width: 50%;
			height: 50%;
			padding: 16px;
			border: 16px solid orange;
			background-color: white;
			z-index:1002;
			overflow: auto;
		}
	</style>
	</head>
	<body>
		<p>This is the main content. To display a lightbox click <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">here</a></p>
		<div id="light" class="white_content">   Inserisci qui la posizione modulo    <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a></div>
		<div id="fade" class="black_overlay"></div>
	</body>
</html>

Ovviamente avete la possibilità di inserire lo stile nel vostro foglio css e gli elementi nella index.php ecco la demo

Autore Topic: Posizione modulo in lightbox a comparsa [RISOLTO] (Letto 3014 volte)

password

Posizione modulo in lightbox a comparsa [RISOLTO]

password

Re:Posizione modulo in lightbox a comparsa