The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Login/Logout Drop Down Boxes from Ange Tuteur

View previous topic View next topic Go down

Solved Login/Logout Drop Down Boxes from Ange Tuteur

Post by Blackstingray1967 on November 10th 2014, 4:24 am

Hey,

I came across your code for a nice login/logout dropdown box. It looks great in Chrome but appears somewhat truncated and off to the side in IE. Any suggestions on how I can fix those issues in IE.

Also, if it can be adjusted to fit IE I would like to use it instead of the redundant login/logout sections on the forum login page is that is possible.

Thanks.

E

Blackstingray1967
New Member

Posts : 15
Reputation : 1
Language : English

Back to top Go down

Solved Re: Login/Logout Drop Down Boxes from Ange Tuteur

Post by Ange Tuteur on November 10th 2014, 5:48 am

Hello Blackstingray1967,

Try replacing the script with the one below to see if it still has problems.
Code:
$(function() {
 
  var panel = {
  time : 750, // animation duration
  background : '#F7F7F7', // background color
  border : '#DDDDDD', // border color
  shadow : 1 // panel shadow [ 1 = on || 0 = off ]
  };
 
  var t0 = 'style="margin:0px 2px;"', t1 = panel["shadow"], t2 = panel["time"],t3;
 
  if (t1 == 1) { t3 = 'box-shadow:2px 2px 6px rgba(0,0,0,0.3);' }
  else { t3 = 'box-shadow:none;' }

  var style = 'position:fixed;background:'+panel["background"]+';border:1px solid '+panel["border"]+';display:inline-block;padding:10px;z-index:99999;'+t3,
  login = '<div id="quickLoginPanel" style="'+style+'"><fieldset class="fields1 fld_connexion"><form name="form_login" method="post" action="/login"><dl><dt><label for="username">Username:</label></dt><dd><input id="username" class="inputbox autowidth" type="text" value="" maxlength="40" size="25" name="username" tabindex="1"></dd></dl><dl><dt><label for="password">Password:</label></dt><dd><input id="password" class="inputbox autowidth" type="password" maxlength="25" size="25" name="password" tabindex="2"></dd><dd><a href="/profile?mode=sendpassword">I forgot my password</a></dd></dl><dl><dd><label for="autologin"><input id="autologin" class="radio" type="checkbox" tabindex="4" name="autologin">Log in automatically</label></dd></dl><dl><dt>&nbsp;</dt><dd><input type="hidden" value="" name="redirect"><input type="hidden" value="" name="query"><input class="button1" type="submit" value="Log in" tabindex="6" name="login"></dd></dl><a href="" id="quickLoginClose">Close</a><form></fieldset></div>',
  logout = '<div id="quickLogoutPanel" style="'+style+'"><form method="post" action="/login?logout=true"><p>Are you sure you want to log out ?</p><fieldset class="submit-buttons"><div id="tid" style="display:none;"></div><div id="key" style="display:none;"></div><input class="button2" type="submit" value="Yes" name="confirm" '+t0+'><input class="button2" type="submit" value="No" name="cancel" id="quickLogoutClose" '+t0+'></fieldset></form></div>';
 
  if (!document.getElementById('logout')) {
  $('a.mainmenu[href="/login"]').click(function() {
  if (!document.getElementById('quickLoginPanel')) {
  $('body').append(login);
  $('#quickLoginPanel').offset($(this).offset()).css('top','-25%').animate({top:'40px'}, t2);
 
  $('#quickLoginClose').click(function() {
  $('#quickLoginPanel').animate({top:'-25%'}, t2, function() {
  $('#quickLoginPanel').remove();
  });
  return false;
  });
  }
  return false;
  });
  }

  else {
  $('#logout').click(function() {
  if (!document.getElementById('quickLogoutPanel')) {
  $('body').append(logout);
  $('#tid').load('/login?logout=1 input[name="tid"]');
  $('#key').load('/login?logout=1 input[name="key"]');
  $('#quickLogoutPanel').offset($(this).offset()).css('top','-25%').animate({top:'40px'}, t2);
 
  $('#quickLogoutClose').click(function() {
  $('#quickLogoutPanel').animate({top:'-25%'}, t2, function() {
  $('#quickLogoutPanel').remove();
  });
  return false;
  });
  }
  return false;
  });
  }
});

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Login/Logout Drop Down Boxes from Ange Tuteur

Post by inallsorts on November 10th 2014, 6:54 am

Just letting you know, I've tried the above code (phpBB3) and while It displays fine In IE, It's out of frame In both Firefox & Opera as per below:


inallsorts
Forumember

Posts : 246
Reputation : 8
Language : English

Back to top Go down

Solved Re: Login/Logout Drop Down Boxes from Ange Tuteur

Post by Blackstingray1967 on November 10th 2014, 8:13 am

Ange Tuteur,

The updated code is now displaying fine in IE and Chrome.

Now is there any way to get rid of all that duplicated login information on the login page and use only this new code for logins and logouts?

Thanks again!

E

Blackstingray1967
New Member

Posts : 15
Reputation : 1
Language : English

Back to top Go down

Solved Re: Login/Logout Drop Down Boxes from Ange Tuteur

Post by Ange Tuteur on November 10th 2014, 8:22 am

You could hide the main information if the user is viewing /login .

Try this :
Administration Panel > Modules > JavaScript codes management > Create a new script

Title : Your choice
Placement : In all the pages
Paste the code below and submit :
Code:
window.location.pathname === '/login' && $(function(){$('.main').css('display','none')});

@inallsorts The default code should work perfect on phpbb3, as it uses classes from phpbb3. punbb was using the class 'left' and it caused some problems on IE.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Login/Logout Drop Down Boxes from Ange Tuteur

Post by Blackstingray1967 on November 10th 2014, 8:42 am

Ange Tuteur,

It works perfectly. You're the best. Thanks again! Very Happy

Blackstingray1967
New Member

Posts : 15
Reputation : 1
Language : English

Back to top Go down

Solved Re: Login/Logout Drop Down Boxes from Ange Tuteur

Post by Ange Tuteur on November 10th 2014, 9:20 am

You're welcome Very Happy

Topic archived

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum