Popup Login. Come Fare?

http://forum.forumactif.com/

Sul forum di supporto francese quando passi su connexion appare un form login. Mi piacerebbe sapere come ottenere lo stesso effetto su un altro Forum. Non ho trovato niente come al solito >.<

Ciao, ho provato devo correggere alcuni errori..le uniche cose che non farà è scomparire quando inserisci il tutto in pratica dovrai schiacciare la x e l'apparire quando il cursore del mouse è su login.. poi magari passando qui il codice qualcuno risolverà l'errore..

L'ho messo in generalità..proverò in un widget (;

Edit

Allora anche mettendolo in un widget e settando i permessi nel widget non sparisce, cmq html in pda>visualizzazione>prima pagina>generalità poi fai te..

Codice:

<div class="quick_connex panel introduction"><img class="connec_close" src="http://2img.net/i/fa/fdf3/suppri12.png" alt="(X)" title="Chiudi" onclick="$('.quick_connex').remove();"><form name="form_login" method="post" action="/login"><dl><dt><label for="username">Nick Name:</label></dt><dd><input type="text" class="inputbox autowidth" value="" maxlength="40" size="25" id="username" name="username" tabindex="1"></dd></dl><dl><dt><label for="password">Password:</label></dt><dd><input type="password" class="inputbox autowidth" maxlength="25" size="25" name="password" id="password" tabindex="2"></dd></dl><dl><dt>&nbsp;</dt><dd><input type="hidden" value="" name="redirect"><input type="hidden" value="" name="query"><input type="submit" class="button1" value="Connetti!" tabindex="6" name="login"></dd></dl></form></div>


E sta spattoffia qua nel css. Pda>visualizzazione>immagini e colori>colori>foglio di stile css. Incolla tutto sotto.

Codice:

#left .module, #profile-advanced-right .module, .panel#postingbox, .panel.introduction, .panel.loginPanel, .portal .module {
-moz-border-radius: 4px;
-o-border-radius: 4px;
-webkit-border-radius: 4px;
background-image: url(http://2img.net/i/fa/optimisation_fdf/fr/bg_pannel.png);
background-position: center bottom;
background-repeat: repeat-x;
border: 1px solid #C3E0F1;
border-radius: 4px;
box-shadow: 1px 1px 1px;
margin: 3px 1px;
padding-bottom: 8px;
padding-top: 4px;
}

.quick_connex {
box-shadow: 0 0 10px!important;
padding: 5px;
position: absolute;
right: 200px;
top: 185px;
width: 230px;
}

.panel {
background-color: #E5F1F9;
color: #666;
margin-bottom: 4px;
padding: 0 10px;
}

.quick_connex .connec_close {
bottom: 3px;
float: right;
left: 5px;
position: relative;
}

form {
display: block;
margin-top: 0em;
}

label {
color: #666;
cursor: default;
padding-right: 5px;
}

dd {
display: block;
-webkit-margin-start: 40px;
}

input[type="text"], input[type="password"], select, textarea {
border: 1px solid #00A5CD!important;
box-shadow: 1px 1px 1px #fff;
}
input.inputbox {
width: 85%;
}
.autowidth {
width: auto!important;
}
.inputbox {
background-color: white;
border: 1px solid #BCBCBC;
color: #666;
cursor: text;
padding: 2px;
}
dd input, dd textarea {
margin-right: 3px;
}
input {
cursor: pointer;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 1em;
font-weight: 400;
padding: 0 3px;
vertical-align: middle;
}

input:not([type]), input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"] {
padding: 1px 0px;
}
user agent stylesheetinput, input[type="password"], input[type="search"], isindex {
-webkit-appearance: textfield;
padding: 1px;
background-color: white;
border: 2px inset;
border-image: initial;
-webkit-rtl-ordering: logical;
-webkit-user-select: text;
cursor: auto;
}
user agent stylesheetinput, textarea, keygen, select, button, isindex {
margin: 0em;
font: -webkit-small-control;
color: initial;
letter-spacing: normal;
word-spacing: normal;
line-height: normal;
text-transform: none;
text-indent: 0px;
text-shadow: none;
display: inline-block;
text-align: -webkit-auto;
}

dl {
display: block;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}

dt label {
font-weight: 700;
text-align: center;
}
label {
color: #666;
cursor: default;
padding-right: 5px;
}

#search-box input.button2, a.button2, input.button1, input.button2 {
background-color: whiteSmoke;
background-image: url(http://2img.net/i/fa/optimisation_fdf/fr/bg_buttons.png);
background-repeat: repeat-x;
border: 1px solid #C3E0F1;
border-radius: 2px;
box-shadow: 1px 1px 1px;
color: #666!important;
cursor: pointer;
font-size: 11px;
font-weight: 700;
height: 24px;
line-height: 27px;
margin: 5px 6px;
padding: 0 8px!important;
text-align: center;
}
a.button2, body:last-child a.button1, button.button2, input.button1, input.button2 {
padding: 1px 0;
}
a.button1, a.button2, button.button2, input.button1, input.button2 {
background-color: #FAFAFA;
background-image: url(http://2img.net/i/fa/prosilver/bg_button.gif);
background-position: top;
background-repeat: repeat-x;
color: black;
font-family: Verdana,Arial,Helvetica,sans-serif;
overflow: visible;
padding: 2px 3px;
width: auto!important;
}
a.button1, input.button1 {
border: 1px solid #666;
font-weight: 700;
}
button.button2, input.button1, input.button2 {
font-size: 1em;
}
dd input, dd textarea {
margin-right: 3px;
}

L'ho modificato perchè hanno impostato parametri di cui non so niente e naturalmente tradotto in italiano. Spero che ti vada bene uguale perchè è stato un pochetto difficile >.<

Se qualcuno riscontra errori o risolve il problema dello scomparire è pregato di postare i codici giusti inviandomeli in privato. Provvederò ad aggiustare i suddetti.

L' ho provato ma appare subito quando carichi la pagina e non quando vai su connessione. In più mi da sfondi di tabelle in aree che non voglio.

http://lalaka.bforum.biz/forum (Il forum è di prova quindi non direi che è spam)

Comunque grazie, dato che hai già fatto molto

Damian ha scritto:le uniche cose che non farà è scomparire quando inserisci il tutto in pratica dovrai schiacciare la x e l'apparire quando il cursore del mouse è su login.. poi magari passando qui il codice qualcuno risolverà l'errore..

Le tabelle sono

Codice:

dd { ecc

poi ognuno deve configurarlo possiamo dire che sto codice da noi è in beta XD.

Io l'ho provato su un forum di larghezza 958px; perchè almeno va sullo sfondo e non su topic scritte ecc