Top subiecte apreciate

Optiuni experimentale
  • Foloseste AJAX in formulare ori de cate ori este posibil

Navigare rapidă

Ultimele subiecte
» Wireless ipb theme [punBB]
Scris de WinaTickets Astazi la 11:37
» [Animate] Recent Topic IPB
Scris de DenisPasca Lun 5 Dec - 22:44
» Ipb Counter-strike Special FG
Scris de DenisPasca Sam 3 Dec - 22:52
» Special Theme Extrem Tutorials
Scris de cosminelu21 Vin 2 Dec - 23:48
Cuvinte-cheie

profil  Statistici  cautare  Mesaje  Bara  legenda  animate  menu  tutorial  radio  banner  phpBB2  subforumuri  html  ultimele  punbb  navigare  tema  meniu  avatar  reclama  edit  Metin2  chenar  drop  subiecte  

[All Version] Login Box


Buna Ziua,
Astazi ma gandit sa va arat cum puteti realiza un Login box pentru versiunea phpbb3.
Sa incepem.
Pasul 1. (JS)
ACP > Module > HTML & JAVASCRIPT > Gestiunea codurilor JavaScript > Creati un nou JavaScript
Title: Login Box
Amplsare: Toate Paginile
Cod JS:
Cod:
$(function() {
$('li:contains(Conectare)').replaceWith('<li><a class="mainmenu" id="login" href="#" rel="nofollow"><img id="i_icon_mini_login" src="http://illiweb.com/fa/empty.gif" border="0" hspace="2" alt="Log in" title="Log in">Conectare</a>  </li>');
$('head').append('<div id="panel"><div class="inner"><form action="/login.forum" method="post"><table cellspacing="1" cellpadding="3" border="0"><tbody><tr><td width="45%" align="right"> Username:</td><td><input type="text" name="username" size="25" maxlength="40" /></td></tr><tr><td align="right">Password:</td><td><input type="password" name="password" size="25" maxlength="32" /></td></tr><tr align="center"><td colspan="2">Log me on automatically each visit: <input type="checkbox" name="autologin" checked="true" /></td></tr><tr align="center"><td colspan="2"><input type="submit" class="mainoption" name="login" value="Log in" /></td></tr></tbody></table></form></div></div>'); $('#login').click(function(e) {
$('#panel').appendTo('li:contains(Conectare)', function(e) {
$('#panel').toggle(); });}); })
(windows);

Pasul 2.
ACP > Afisare > Imagini si Culori > Culori > Foaia de stil CSS
Cod:
#panel {
margin-left: 34%;
background: #E4EFF3;
width: 30%;
border: 1px double #2597CC;
color: #7AC;
padding: 5px;
border-radius: 3px;
}

#panel input {
padding: 3px 6px;
border: 1px solid #CCC;
background: #FCFCFC!important;
border-radius: 3px;
}

Enjoy.
Dovada :
1. (Inainte de click)
2. (Dupa click)

Tutorial relizat de InFeRn0.
Reproducerea acestui tutorial nu este posibila fara acordul nostru, in conformitate cu articolul L122-1 apartinand ICC.

Comentariile utilizatorilor

Fii primul care comenteaza acest articol