top


Sliding JQuery Login Panel - on Sat Jan 15, 2011 7:52 am Author: sgeorge

Hello to all again !! I found that → http://web-kreation.com/demos/Sliding_login_panel_jquery/# but I do not know how to add it... Could you please help me ? Thank you,sgeorge.

phpbb2 forum

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 8:33 am Author: Johnson5756

Have read it's tutorials?
If you already did that...

Just add the HTML right after your <body> tag.
Add the CSS given into your stylesheet.
And then add the jQuery in your <head>.

You shouldn't have any problem doing that.
And remember to host the images yourself, unless you know how to get the image address from that website.

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 8:42 am Author: sgeorge

I want to use the default login panel in jQuey panel... Like this http://pcf-criminology.forumotions.com/forum site...

Thanks

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 8:50 am Author: Johnson5756

http://help.forumotion.com/t52770-log-in-command-under-each-forum
Here you go.

Remember to edit the style of it.

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 11:52 am Author: sgeorge

I created that →

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html  xmlns="http://www.w3.org/1999/xhtml" dir="ltr" id="min-width" lang="en" xml:lang="en"  ><head><!--
 stylesheets --><link rel="stylesheet" href="http://web-kreation.com/demos/Sliding_login_panel_jquery/css/style.css" type="text/css" media="screen" /><link rel="stylesheet" href="http://web-kreation.com/demos/Sliding_login_panel_jquery/css/slide.css" type="text/css" media="screen" /><!--
 PNG FIX for IE6 --><!--
 http://24ways.org/2007/supersleight-transparent-png-in-ie6 --><!--[if lte IE 6]><script type="text/javascript" src="http://alig.mezoka.com/slider/js/pngfix/supersleight-min.js"></script><![endif]--><!--
 jQuery - the core --><script src="http://alig.mezoka.com/slider/js/jquery-1.3.2.min.js" type="text/javascript"></script><!--
 Sliding effect --><script src="http://alig.mezoka.com/slider/js/slide.js" type="text/javascript"></script><!--
 Panel --><div id="toppanel"><div id="panel"><div class="content clearfix"><div class="left"><!--
 Register Form --><h2>Καλώς Ήρθατε στο Radio Sound All</h2>      <p class="info">Παρακαλώ ελέγξτε τους <a href="http://radiosoundall.forumotion.com/t6-topic">κανόνες</a> ώστε να είστε πλήρως ενημερωμένοι.</p><h2>Χρειάζεστε Βοήθεια;</h2>  <p class="info">Μπορείτε εαν θέλετε πριν ξεκινήσετε να χρισιμοποιείτε την ιστοσελίδα μας να ελέγξετε το <a href="http://radiosoundall.forumotion.com/faq">FAQ (Συχνές Ερωτήσεις)</a> to learn the basics of the game.</p><h2>Μπορείτε ακόμα να χρισημοποιήσετε το Chatbox!</h2><br><p class="info">Πατήστε <a href="javascript: void(0)"onclick="window.open('http://radiosoundall.forumotion.com/chatbox/chatbox.forum?','windowname1','width=771, height=561');return false;">Εδώ</a> για να ανοίξετε το Chatbox και να επικοινωνίσετε με άλλα μέλη</p></div><div class="left right"><!--
 Login Form --><form action="http://radiosoundall.forumotion.com/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">Stay logged in: <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" /><input type="button" class="mainoption" value="Register" onclick="parent.location='/register';" /><br/><br/><a href="http://radiosoundall.forumotion.com//profile.forum?mode=sendpassword">Lost your password?</a></td></tr></tbody></table></form>      </div><div class="right"><!--
 Login Form --><form action="http://radiosoundall.forumotion.com/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">Stay logged in: <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" /><input type="button" class="mainoption" value="Register" onclick="parent.location='/register';" /><br/><br/><a href="http://radiosoundall.forumotion.com//profile.forum?mode=sendpassword">Lost your password?</a></td></tr></tbody></table></form>      </div></div></div><!--
 /login --><!--
 The tab on top --> <div class="tab"><ul class="login"><li class="left"> </li><li>Hello guest !</li><li class="sep">|</li><li id="toggle"><a id="open" class="open" href="#">Log In | Register</a><a id="close" style="display: none;" class="close" href="#">Close Panel</a>      </li><li class="right"> </li></ul></div><!--
 / top --></div><!--
panel --></body></html>




but how can I make it change after the log in of the member ? I mean not to say log in|Register but to say Logout ...

Sorry for the language used...

thank you

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 11:55 am Author: Japorized

http://help.forumotion.com/t84649-how#546211

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 12:01 pm Author: sgeorge

Gangstar15 wrote:http://help.forumotion.com/t84649-how#546211



Hm... I don't think that I want that... xD

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 12:06 pm Author: Japorized

lol, yes its.. :

Code:
<div id="log-in-info">

<span id="log-in-info-cont">
<!-- BEGIN switch_user_logged_out -->
Hello, Guest | <a href="/register">Register</a> | <a href="/login">Login</a>
<!-- END switch_user_logged_out -->
<!-- BEGIN switch_user_logged_in -->
{LOGGED_AS} <a href="/profile.forum?mode=editprofile">Account</a> | <a href="/login?logout">Log out</a>
<!-- END switch_user_logged_in -->
</span>

</div>

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 12:46 pm Author: sgeorge

Sorry... I don't get it... could you say me Gangstar what should I add on the whole ? I mean the full codes..

Thank you !

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 1:41 pm Author: Japorized

http://help.forumotion.com/t78982-sliding-log-in-panelneed-help

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 2:16 pm Author: sgeorge

Well If I add this →



Code:
<!-- stylesheets -->
    <link rel="stylesheet" href="http://web-kreation.com/demos/Sliding_login_panel_jquery/css/style.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="http://web-kreation.com/demos/Sliding_login_panel_jquery/css/slide.css" type="text/css" media="screen" />
 
    <!-- PNG FIX for IE6 -->
    <!-- http://24ways.org/2007/supersleight-transparent-png-in-ie6 -->
  <!--[if lte IE 6]>
      <script type="text/javascript" src="http://alig.mezoka.com/slider/js/pngfix/supersleight-min.js"></script>
  <![endif]-->
   
    <!-- jQuery - the core -->
  <script src="http://alig.mezoka.com/slider/js/jquery-1.3.2.min.js" type="text/javascript"></script>
  <!-- Sliding effect -->
  <script src="http://alig.mezoka.com/slider/js/slide.js" type="text/javascript"></script>


My forum colors and the font size are not as I want them.. The text is black and the font size is bigger...

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 2:20 pm Author: Japorized

I didn't said u should add this. but read the others posts and you will find how to change them from Guests view to members view.

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 2:30 pm Author: sgeorge

Gangstar15 wrote:I didn't said u should add this. but read the others posts and you will find how to change them from Guests view to members view.


I did it !!! From yesterday I am trying to do something but there it is nothing clear ! wow! Everyone is talking for his forum... Why the cannot wait for an answer and not spamming ? Thank you... I am trying to find something but I cannot understand anything... Sad

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 2:40 pm Author: Japorized

u need only to read my posts Razz

Code:
<!-- BEGIN switch_user_logged_out -->
<!-- Panel -->
<div id="toppanel">
  <div id="panel">
      <div class="content clearfix">
        <div class="left">
            <!-- Register Form -->
        <h2>Welcome to To My site</h2>     
              <p class="info">
              YOU TEXT HERE!
              </p>
             
        </div>


        <div class="left right">

<!-- Login Form -->
            <form action="http://test-liqued-coding.forumotion.com/login.forum?connexion" 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">Stay logged in: <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" />
<input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
<br/><br/><a href="http://test-liqued-coding.forumotion.com/profile.forum?mode=sendpassword">Lost your password?</a>
</td></tr></tbody></table></form>       

     
        </div>
      </div>
</div> <!-- /login --> 


  <!-- The tab on top --> 
  <div class="tab">
      <ul class="login">
        <li class="left"> </li>
        <li>Hello Guest</li>
        <li class="sep">|</li>
        <li id="toggle">
            <a id="open" class="open" href="#">Log In | Register</a>
            <a id="close" style="display: none;" class="close" href="#">Close Panel</a>       
        </li>
        <li class="right"> </li>
      </ul>
  </div>



 <!-- / top -->

</div>

<!--panel -->
<!-- END switch_user_logged_out -->


<!-- BEGIN switch_user_logged_in -->
<!-- Panel -->
<div id="toppanel">
  <div id="panel">
      <div class="content clearfix">
        <div class="left">
          <!-- Register Form -->
              <h2>Music Playlist!</h2>
              <img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyODgzODA2NjA1MTUmcHQ9MTI4ODM4MDY2NzA5MyZwPTE4MDMxJmQ9Jmc9MSZvPTljYzIxNGVjZmUyMDQ3YmNiYWVh/MjFmYzMyZDAzYWZm.gif" /><embed src="http://assets.mixpod.com/swf/mp3/mff-mpodmin.swf?myid=70657282&path=2010/10/29" quality="high" wmode="transparent" flashvars="mycolor=222222&mycolor2=77ADD1&mycolor3=FFFFFF&autoplay=false&rand=0&f=4&vol=100&pat=0&grad=false" width="158" height="208" name="myflashfetish" salign="TL" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" border="0" style="visibility:visible;width:158px;height:208px;" />
        </div>


        <div class="left right">

<!-- Login Form -->
            TEXT HERE!  TEXT HERE!  TEXT HERE!  TEXT HERE!
        </div>
      </div>
</div> <!-- /login --> 

  <!-- The tab on top --> 
  <div class="tab">
      <ul class="login">
        <li class="left"> </li>
        <li>{LOGGED_AS} </li>
        <li class="sep">|</li>
        <li> <a href="/profile.forum?mode=editprofile" title="Edit your profile">Profile</a></li>
        <li class="sep">|</li>
        <li><a href="/msg.forum?folder=inbox">Inbox</a> </li>
        <li class="sep">|</li>
        <li><a href="/search.forum">Search</a> </li>
        <li class="sep">|</li>
        <li id="toggle">
            <a id="open" class="open" href="#">Open Panel</a>
            <a id="close" style="display: none;" class="close" href="#">Close Panel</a>
        </li>
        <li class="right"> </li>
      </ul>
  </div> <!-- / top -->
 
</div> <!--panel -->
<!-- END switch_user_logged_in -->

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 3:01 pm Author: sgeorge

http://rsa-tranning-forum.board-directory.com That's what I get... Sad Oh I will never have it :(

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 3:03 pm Author: Japorized

now replace the CSS and javascript links with these:

Code:
<!-- stylesheets -->
    <link rel="stylesheet" href="http://web-kreation.com/demos/Sliding_login_panel_jquery/css/style.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="http://web-kreation.com/demos/Sliding_login_panel_jquery/css/slide.css" type="text/css" media="screen" />
 
    <!-- PNG FIX for IE6 -->
    <!-- http://24ways.org/2007/supersleight-transparent-png-in-ie6 -->
  <!--[if lte IE 6]>
      <script type="text/javascript" src="http://alig.mezoka.com/slider/js/pngfix/supersleight-min.js"></script>
  <![endif]-->
   
    <!-- jQuery - the core -->
  <script src="http://alig.mezoka.com/slider/js/jquery-1.3.2.min.js" type="text/javascript"></script>
  <!-- Sliding effect -->
  <script src="http://alig.mezoka.com/slider/js/slide.js" type="text/javascript"></script>

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 3:23 pm Author: sgeorge

Sorry Gangstar, I don't get you... I cannot find what you want me to replace... Really sorry... So do you want me to paste that code on my overall HEader and after that to use the code you gave me above ?


Code:
<!-- BEGIN switch_user_logged_out -->
<!-- Panel -->
<div id="toppanel">
  <div id="panel">
      <div class="content clearfix">
        <div class="left">
            <!-- Register Form -->
        <h2>Welcome to To My site</h2>     
              <p class="info">
              YOU TEXT HERE!
              </p>
             
        </div>


        <div class="left right">

<!-- Login Form -->
            <form action="http://test-liqued-coding.forumotion.com/login.forum?connexion" 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">Stay logged in: <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" />
<input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
<br/><br/><a href="http://test-liqued-coding.forumotion.com/profile.forum?mode=sendpassword">Lost your password?</a>
</td></tr></tbody></table></form>       

     
        </div>
      </div>
</div> <!-- /login --> 


  <!-- The tab on top --> 
  <div class="tab">
      <ul class="login">
        <li class="left"> </li>
        <li>Hello Guest</li>
        <li class="sep">|</li>
        <li id="toggle">
            <a id="open" class="open" href="#">Log In | Register</a>
            <a id="close" style="display: none;" class="close" href="#">Close Panel</a>       
        </li>
        <li class="right"> </li>
      </ul>
  </div>



 <!-- / top -->

</div>

<!--panel -->
<!-- END switch_user_logged_out -->


<!-- BEGIN switch_user_logged_in -->
<!-- Panel -->
<div id="toppanel">
  <div id="panel">
      <div class="content clearfix">
        <div class="left">
          <!-- Register Form -->
              <h2>Music Playlist!</h2>
              <img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyODgzODA2NjA1MTUmcHQ9MTI4ODM4MDY2NzA5MyZwPTE4MDMxJmQ9Jmc9MSZvPTljYzIxNGVjZmUyMDQ3YmNiYWVh/MjFmYzMyZDAzYWZm.gif" /><embed src="http://assets.mixpod.com/swf/mp3/mff-mpodmin.swf?myid=70657282&path=2010/10/29" quality="high" wmode="transparent" flashvars="mycolor=222222&mycolor2=77ADD1&mycolor3=FFFFFF&autoplay=false&rand=0&f=4&vol=100&pat=0&grad=false" width="158" height="208" name="myflashfetish" salign="TL" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" border="0" style="visibility:visible;width:158px;height:208px;" />
        </div>


        <div class="left right">

<!-- Login Form -->
            TEXT HERE!  TEXT HERE!  TEXT HERE!  TEXT HERE!
        </div>
      </div>
</div> <!-- /login --> 

  <!-- The tab on top --> 
  <div class="tab">
      <ul class="login">
        <li class="left"> </li>
        <li>{LOGGED_AS} </li>
        <li class="sep">|</li>
        <li> <a href="/profile.forum?mode=editprofile" title="Edit your profile">Profile</a></li>
        <li class="sep">|</li>
        <li><a href="/msg.forum?folder=inbox">Inbox</a> </li>
        <li class="sep">|</li>
        <li><a href="/search.forum">Search</a> </li>
        <li class="sep">|</li>
        <li id="toggle">
            <a id="open" class="open" href="#">Open Panel</a>
            <a id="close" style="display: none;" class="close" href="#">Close Panel</a>
        </li>
        <li class="right"> </li>
      </ul>
  </div> <!-- / top -->
 
</div> <!--panel -->
<!-- END switch_user_logged_in -->

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 4:09 pm Author: Johnson5756

Gosh... that was a blur...
Let's clear things up...

To show your content only to members

Code:
<!-- BEGIN switch_user_logged_in -->
This content can only be seen by members
<!-- END switch_user_logged_in -->


To show your content only to guests
Code:
<!-- BEGIN switch_user_logged_out -->
This content is readable by only guests
<!-- END switch_user_logged_out -->


So use some creativity and mathematical reasoning, optimise these built-in tags in your panel. Many of you really need to learn how to be independent in stuff like this.

I'm very sorry if my words are harsh.

Re: Sliding JQuery Login Panel - on Sat Jan 15, 2011 4:48 pm Author: sgeorge

well I said... I don't know how to code... Look If I add that CSS Style,the text is bigger... Can't I edit the CSS file ?

Re: Sliding JQuery Login Panel - on Sun Jan 16, 2011 2:54 pm Author: sgeorge

I need some help to finish the code... Here is what I have complete to end it

Code:
<!--
 The tab on top --> <div class="tab"><ul class="login"><li class="left"> </li><li><!-- BEGIN switch_user_logged_out -->Hello !<!-- END switch_user_logged_out --><!-- BEGIN switch_user_logged_in -->{USERNAME}<!-- END switch_user_logged_in --></li><li class="sep">|</li><li id="toggle"><a id="open" class="open" href="#"><!-- BEGIN switch_user_logged_out -->Σύνδεση<!-- END switch_user_logged_out --><!-- BEGIN switch_user_logged_in -->ANOIGMA<!-- END switch_user_logged_in --></a><a id="close" style="display: none;" class="close" href="#">Κλείσιμο</a>      </li><li class="right"> </li></ul></div><!--
 / top -->


I want to make say for guests "Hello !" and for members to say their name so I used the
Code:
{USERNAME}
command.

Thank you !

Goto page : 1, 2  Next