MyBB Community Forums

MyBB Community Forums > Resources > Tutorials > Adding a modal login box to MyBB using jQuery
Full Version: Adding a modal login box to MyBB using jQuery
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26

Trickshot

2012-07-21, 10:42 AM
(2012-07-21, 10:37 AM)euantor Wrote: [ -> ]Did you modify the header_welcomeblock_guest template too?

No.. Sorry I guess I didn't see that part Confused


but where you say it should look similar to my current header_welcomeblock_guest do I just take the code in OP and paste it into header_welcomeblock_guest?

Current header_welcomeblock_guest:

<script type="text/javascript">
<!--
	lang.username = "{$login_username}";
	lang.password = "{$lang->login_password}";
	lang.login = "{$lang->login}";
	lang.lost_password = " &mdash; <a href=\"{$mybb->settings['bburl']}/member.php?action=lostpw\">{$lang->lost_password}<\/a>";
	lang.register_url = " &mdash; <a href=\"{$mybb->settings['bburl']}/member.php?action=register\">{$lang->welcome_register}<\/a>";
	lang.remember_me = "{$lang->remember_me}";
// -->
</script>
<span style="float: right;">{$lang->welcome_current_time}</span>
		<span id="quick_login">{$lang->welcome_guest} (<a href="{$mybb->settings['bburl']}/member.php?action=login" onclick="MyBB.quickLogin(); return false;">{$lang->welcome_login}</a> &mdash; <a href="{$mybb->settings['bburl']}/member.php?action=register">{$lang->welcome_register}</a>)</span>

do I delete that and paste the header_welcomeblock_guest that's in OP into header_welcomeblock_guest?

Euan T

2012-07-21, 10:43 AM
Yes, just replace it and it should work fine Smile

Trickshot

2012-07-21, 10:51 AM
(2012-07-21, 10:43 AM)euantor Wrote: [ -> ]Yes, just replace it and it should work fine Smile

Alright that's it Smile

Thanks!
Sorry to bug you again but how could I remove these white tips? :o

http://gyazo.com/5bc4a7221211110c43de1c1ddd83b5d5.png

Lummox

2012-08-02, 11:02 PM
Hello, when replacing the code in "header_welcomeblock_guest" shows me this error on my forum;

MyBB Internal Error

MyBB has experienced an internal error and cannot continue.

Error Type:
Catchable Fatal Error (4096)
Error Message:
Object of class MyBB could not be converted to string
Location:
File: global.php(374) : eval()'d code
Line: 3
Backtrace:
File Line Function
/inc/class_error.php 206 errorHandler->output_error
/global.php(374) : eval()'d code 3 errorHandler->error
/global.php 374 eval
/index.php 18 require_once

Please contact the MyBB Group for support.

Euan T

2012-08-03, 12:55 PM
Could you post the content of the template please?

Lummox

2012-08-04, 08:37 AM
Sure!

Headerinclude:

<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />
<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />
<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/ventana_flotante.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1601"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1601"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1601"></script>
{$ncoderesize_script}{$stylesheets}   
{$darkrevolutioncss}
{$darkrevmeta}

<script type="text/javascript" src="{$mybb->settings['bburl']}/images/darkrev/theme.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
<!--
    var cookieDomain = "{$mybb->settings['cookiedomain']}";
    var cookiePath = "{$mybb->settings['cookiepath']}";
    var cookiePrefix = "{$mybb->settings['cookieprefix']}";
    var deleteevent_confirm = "{$lang->deleteevent_confirm}";
    var removeattach_confirm = "{$lang->removeattach_confirm}";
    var loading_text = '{$lang->ajax_loading}';
    var saving_changes = '{$lang->saving_changes}';
    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";
    var my_post_key = "{$mybb->post_code}";
    var imagepath = "{$theme['imgdir']}";
// -->
</script>
{$newpmmsg}

<script type="text/javascript">
jQuery.noConflict();
    jQuery(function() {    
        jQuery("#slide-in-loginform").click(function () {    
            jQuery('.logintext').animate({
                marginTop: '-50px'
            }, "slow").css('margin-top', '-50px');
        });
    });
</script>

<script type="text/javascript">
/**
 * Modal Boxes JS
 *
 * @author Euan T. <[email protected]>
 * @version 1.0.0
 */

jQuery.noConflict();

jQuery(document).ready(function($)
{
    // Make the jQuery modal login redirect you back to the page you're currently on //
    $('#loginModal input[name="url"]').attr("value", window.location);
    // /Login redirect //

    // Modal Boxes //
    $('a[name="modal"]').on('click', function(event)
    {
        event.preventDefault();
        
        var target = $(this).attr('rel');
        
        // Set up the shadowing
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();
        $('#mask').css({'width': maskWidth, 'height': maskHeight});
        $('#mask').fadeIn(1000);    
        $('#mask').fadeTo("slow", 0.8);  
        
        // Position the actual modal
        var winH = $(window).height();
        var winW = $(window).width();
        $(target).css('top',  (winH / 2) - ($(target).height() / 2));
        $(target).css('left', (winW / 2) - ($(target).width() / 2));
        $(target).fadeIn(2000); 
    });
    
    $('.modalBox a[rel="closeModal"]').on('click', function(event)
    {
        event.preventDefault();
        $('#mask, .modalBox').hide();
    }); 
    
    $('#mask').on('click', function ()
    {
        $(this).hide();
        $('.modalBox').hide();
    }); 
    // /Modal Boxes //
});
</script>

This is my template "header_welcomeblock_guest" without change;

<script type="text/javascript">
<!--
	lang.username = "{$login_username}";
	lang.password = "{$lang->login_password}";
	lang.login = "{$lang->login}";
	lang.lost_password = " &mdash; <a href=\"{$mybb->settings['bburl']}/member.php?action=lostpw\">{$lang->lost_password}<\/a>";
	lang.register_url = " &mdash; <a href=\"{$mybb->settings['bburl']}/member.php?action=register\">{$lang->welcome_register}<\/a>";
	lang.remember_me = "{$lang->remember_me}";
// -->
</script>

{$ventana_flotante}
<div class="topbar">
<span id="quick_login"><a href="{$mybb->settings['bburl']}/member.php?action=login" onclick="MyBB.quickLogin(); return false;"><small><img src="images/metin2/iniciar_sesion.png" title="Iniciar sesión" HSPACE=20 VSPACE=15></small></a> <a href="{$mybb->settings['bburl']}/member.php?action=register"><small></small><img src="images/metin2/boton_registro.png" title="Registrarse" HSPACE=20 VSPACE=15></a></span> 
</div>

This is the same template with the changes.:

<div id="mask"></div>
Welcome guest! Please <a href="{$mybb->settings['bburl']}/member.php?action=login" name="modal" rel="#loginModal">{$lang->welcome_login}</a> or <a href="{$mybb->settings['bburl']}/member.php?action=register">{$lang->welcome_register}</a>
<div id="loginModal" class="modalBox loginModalBox">
    <div class="thead">
        Login at {$mybb->settings['bbname']}
    </div>
    <div class="modalContent loginModalContent">
        <form method="post" action="member.php">
            <table border="0" width="100%">
                <tr>
                    <td>
                        <label for="login_username">Username:</label>
                    </td>
                    <td>
                        <input type="text" value="" style="width: 200px;" maxlength="30" size="25" name="username" class="textbox" id="login_username" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="login_password">Password:</label>
                    </td>
                    <td>
                        <input type="password" value="" style="width: 200px;" size="25" name="password" class="textbox" id="login_password" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <label class="smalltext" title="If ticked, your login details will be remembered on this computer, otherwise, you will be logged out as soon as you close your browser."><input type="checkbox" value="yes" checked="checked" name="remember" class="checkbox"> Remember?</label>
                    </td>
                    <td>
                        <input type="submit" value="Login" name="submit" class="button" />
                    </td>
                </tr>
            </table>
            <input type="hidden" value="do_login" name="action" />
            <input type="hidden" value="" name="url" />
        </form>
    </div>
</div>

{$ventana_flotante}
<div class="topbar">
<span id="quick_login"><a href="{$mybb->settings['bburl']}/member.php?action=login" onclick="MyBB.quickLogin(); return false;"><small><img src="images/metin2/iniciar_sesion.png" title="Iniciar sesión" HSPACE=20 VSPACE=15></small></a> <a href="{$mybb->settings['bburl']}/member.php?action=register"><small></small><img src="images/metin2/boton_registro.png" title="Registrarse" HSPACE=20 VSPACE=15></a></span> 
</div>

global.css (At the end is the code for this mod.)

body {
	background: url(images/metin2/bg_body.png) repeat;
	color: #000;
	font-family: sans-serif;
	text-align: center; /* IE 5 fix */
	line-height: 1.3;
	font-size: 13px;
}

a:link {
	color: black;
	text-decoration: underline;
}

a:visited {
	color: black;
	text-decoration: underline;
}

a:hover, a:active {
	color: #942d2d;
	text-decoration: none;
}



#container {
	background: url(images/metin2/bg.png);
	width: 1229px;
	color: #000000;
	background-position: center;
	text-align: left;
	margin: auto auto;
	margin-top: 0px;
	padding-left: 20px;
	padding-right: 20px;
	font-family: sans-serif;
}

#undercontainer {
               background: url(images/metin2/undercontainer.png) repeat-y;
               background-position: center;
	       font-family: sans-serif;
	       text-align: center;
               margin-top: 0px;
               margin: auto auto;
               padding-left: 20px;
	       padding-right: 20px;
}

#header {
	background: transparent;
	width: 1262px;
	color: #000000;
	margin: auto auto;
	text-align: left;
	height: 136px;
	font-family: sans-serif;
}

#content {
	/* FIX: Make internet explorer wrap correctly */
	width: auto !important;
}

.menu {
		background: url(images/metin2/menu_bg.gif) repeat-x;
                background-position: center;               
                margin: auto auto;
                height: 45px;
                width: 1260px;
                float: center;
}

.menu ul {
	color: #000000;
	text-align: center;
	padding: 4px;
        font-weight: bold;
}

.menu li {
        float: left;
	margin: 0;	
	padding: 0 15px 0 0;
}

.menu ul li {
padding: 6px;
margin-left: 115px;
padding-left: 20px;
text-shadow: 0 -2px black;
border-left: ;
}

.menu li a.selected {
}

.menu ul a:link {
	color: #ffe793;
	text-decoration: none;
text-shadow: 0 -2px black;

transition: color .2s;
-webkit-transition: color .2s;
-o-transition: color .2s;
-moz-transition: color .2s;
-khtml-transition: color .2s;
}

.menu ul a:visited {
	color: #ffe793;
	text-decoration: none;
text-shadow: 0 -2px black;
}

.menu ul a:hover {
	color: #FFFF00;
	text-decoration: none;
padding-top: -15px;
text-shadow: 0 -2px black;
}

table {
	color: #000000;
	font-family: sans-serif;
	font-size: 14px;
}

.tborder {
	background: #52320E;
        width: 100%;
	margin: auto auto;
        border: 1px solid #000000;
}

.index-table {
        background: #52320E;
        border: 1px solid #000000;
}

.thead {
background: #8b571d url(images/metin2/thead.png)no-repeat;
color: black;
font-size: 14px;
font-weight: bold;
padding: 10px;
}

.thead a {
font-family: PT Sans;
}

.thead a:link {
	color: #000000;
	text-decoration: none;
}

.thead a:visited {
	color: #000000;
	text-decoration: none;
}

.thead a:hover, .thead a:active {
	color: #8b571d;
	text-decoration: none;
}

.tcat {
	background: #c0a662 url(images/metin2/tcat.png) repeat-x;
	color: #000000;
	font-size: 12px;
}

.tcat a:link {
	color: #000000;
}

.tcat a:visited {
	color: #000000;
}

.tcat a:hover, .tcat a:active {
	color: #000000;
}
.forumdisplay_regular {
	background: url(images/metin2/trow1.png) repeat;
}
.forumdisplay_sticky {
	background: url(images/metin2/trow1.png) repeat;
}
.trow1 {
	background: url(images/metin2/trow1.png) repeat;
        padding: 10px;
}

.trow2 {
        background: url(images/metin2/trow1.png) repeat;
        padding: 10px;
}

.trow3 {
background: url(images/metin2/trow1.png) repeat;
border-bottom: 1px solid #8b571d;
padding: 5px;
}

.trow4 {
background: url(images/metin2/trow1.png) repeat;
border-top: 1px solid #8b571d;
padding: 5px;
}

.trow5 {
background: url(images/metin2/trow1.png) repeat;
border-right: 1px solid #8b571d;
padding: 5px;
}

.index-trow {
	width: 100%;
        background: url(images/metin2/trow1.png) repeat;
}

.trow_shaded {
	background: url(images/metin2/trow1.png) repeat;
}

.trow_selected td {
	background: url(images/metin2/trow1.png) repeat;
}

.trow_sep {
	background: url(images/metin2/trow1.png) repeat;
	color: #000;
	font-size: 12px;
	font-weight: bold;
}

.tfoot {
	background: #8b571d url(images/metin2/tfoot.png) top left no-repeat;
	color: #000000;
font-weight: bold;
font-family: sans-serif;
}

.tfoot a:link {
	color: #000000;
	text-decoration: none;
}

.tfoot a:visited {
	color: #000000;
	text-decoration: none;
}

.tfoot a:hover, .tfoot a:active {
	color: #8b571d;
	text-decoration: none;
}

.bottommenu {
	background: #660000;
        color: #000000;
	padding: 10px;
        text-align: center;
}

.navigation {
	color: #000000;
	font-size: 13px;
text-align: left;
height: 20px;
}

.nav_text {
margin-left: 23px;
}

.navigation a:link {
color: black;
	text-decoration: underline;
}

.navigation a:visited {
color: black;
	text-decoration: underline;
}

.navigation a:hover, .navigation a:active {
color: #942d2d;
	text-decoration: none;
}

.navigation .active {
	color: black;
	font-size: 13px;
	font-weight: bold;
}

.smalltext {
	font-size: 13px;
}

.largetext {
	font-size: 15px;
	font-weight: bold;
}

input.textbox {
	background: #ffffff;
	color: #000000;
	border: 1px solid #0f5c8e;
	padding: 1px;
}

textarea, input {
border-right: solid 1px #C6C6C6;
border-left: solid 1px #C6C6C6;
border-top: solid 1px #CECECE;
border-bottom: solid 1px #A4A4A4;
padding: 1px;
font-family: 'Lucida Grande',Tahoma,Arial,Verdana,Sans-Serif;     
color:#333;
font-size:12px;
}

select {
	background: #ffffff;
	border: 1px solid #0f5c8e;
}

.editor {
	background: #f1f1f1;
	border: 1px solid #ccc;
}

.editor_control_bar {
	background: #f5e87c;
	border: 1px solid #54502a;
}

.autocomplete {
	background: #fff;
	border: 1px solid #000;
	color: black;
}

.autocomplete_selected {
	background: #adcee7;
	color: #000;
}

.popup_menu {
	background: #ccc;
	border: 1px solid #000;
}

.popup_menu .popup_item {
	background: #fff;
	color: #000;
}

.popup_menu .popup_item:hover {
	background: #C7DBEE;
	color: #000;
}

.trow_reputation_positive {
	background: #ccffcc;
}

.trow_reputation_negative {
	background: #ffcccc;
}

.reputation_positive {
	color: green;
}

.reputation_neutral {
	color: #444;
}

.reputation_negative {
	color: red;
}

.invalid_field {
	border: 1px solid #f30;
	color: #f30;
}

.valid_field {
	border: 1px solid #0c0;
}

.validation_error {
	background: url(images/invalid.gif) no-repeat center left;
	color: #f30;
	margin: 5px 0;
	padding: 5px;
	font-weight: bold;
	font-size: 11px;
	padding-left: 22px;
}

.validation_success {
	background: url(images/valid.gif) no-repeat center left;
	color: #00b200;
	margin: 5px 0;
	padding: 5px;
	font-weight: bold;
	font-size: 11px;
	padding-left: 22px;
}

.validation_loading {
	background: url(images/spinner.gif) no-repeat center left;
	color: #555;
	margin: 5px 0;
	padding: 5px;
	font-weight: bold;
	font-size: 11px;
	padding-left: 22px;
}

/* Additional CSS (Master) */
img {
	border: none;
        border: none;
        vertical-align: middle;
}

.clear {
	clear: both;
}

.hidden {
	display: none;
	float: none;
	width: 1%;
}

.hiddenrow {
	display: none;
}

.selectall {
	background-color: #FFFBD9;
	font-weight: bold;
	text-align: center;
}

.float_left {
	float: left;
}

.float_right {
	float: right;
}

.menu ul {
	list-style: none;
	margin: 0;
}

.menu img {
	padding-right: 5px;
	vertical-align: top;
}

#panel .links {
	margin: 0;
	float: right;
}

.expcolimage {
	float: left;
	width: auto;
	vertical-align: middle;
	margin-left: 3px;
margin-right: 5px;
margin-top: -1px;
}

img.attachment {
	border: 1px solid #E9E5D7;
	padding: 2px;
}

hr {
	background-color: #000000;
	color: #000000;
	height: 1px;
	border: 0px;
}

#copyright {
	font: 11px Verdana, Arial, Sans-Serif;
	margin: 0;
	padding: 10px 0 0 0;
}

#debug {
	float: right;
	text-align: right;
	margin-top: 0;
}

blockquote {
padding: 5px;
background: #FFFFFF;
color: #444;
font-weight: 500;
border:2px solid #FE642E;
border-radius: 4px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
position: relative;
}

blockquote cite {
	font-weight: bold;
	border-bottom: 1px solid #ccc;
	font-style: normal;
	display: block;
	margin: 4px 0;
}

blockquote cite span {
	float: right;
	font-weight: normal;
}

blockquote cite span.highlight {
	float: none;
	font-weight: bold;
	padding-bottom: 0;
}

.codeblock {
	background: #fff;
	border: 1px solid #ccc;
	padding: 4px;
}

.codeblock .title {
	border-bottom: 1px solid #ccc;
	font-weight: bold;
	margin: 4px 0;
}

.codeblock code {
	overflow: auto;
	height: auto;
	max-height: 200px;
	display: block;
	font-family: Monaco, Consolas, Courier, monospace;
	font-size: 13px;
}

.subforumicon {
	border: 0;
	vertical-align: middle;
}

.separator {
	margin: 5px;
	padding: 0;
	height: 0px;
	font-size: 1px;
	list-style-type: none;
}

form {
	margin: 0;
	padding: 0;
}

.popup_menu .popup_item_container {
	margin: 1px;
	text-align: left;
}

.popup_menu .popup_item {
	display: block;
	padding: 3px;
	text-decoration: none;
	white-space: nowrap;
}

.popup_menu a.popup_item:hover {
	text-decoration: none;
}

.autocomplete {
	text-align: left;
}

.subject_new {
	font-weight: bold;
}

.highlight {
	background: #FFFFCC;
	padding-top: 3px;
	padding-bottom: 3px;
}

.pm_alert {
	background: #F3E2A9 url(images/metin2/forum.png) no-repeat left;
	padding: 8px;
	margin: auto auto;
	border: 2px solid #29220A;
	color: #000000;
	font-size: 15px;
        font-weight: bold;
       text-align: center;
width: 80%;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}


.red_alert {
	background: #FBE3E4;
	border: 1px solid #A5161A;
	color: #A5161A;
	text-align: center;
	padding: 5px 20px;
	margin-bottom: 15px;
	font-size: 11px;
z-index: 2;
width: 100%;
margin-left: -20px;
border-right: none;
border-left: none;
}

.warning {
		background: url(images/metin2/tablenews.png) no-repeat;
                background-position: center;        
                margin: auto auto;
                height: 175px;
                width: 1229px;
                float: center;
                padding-top: 50px;
                margin-right: 35px;
}

.high_warning {
	color: #CC0000;
}

.moderate_warning {
	color: #F3611B;
}

.low_warning {
	color: #AE5700;
}

div.error {
	padding: 5px 10px;
	border-top: 2px solid #FFD324;
	border-bottom: 2px solid #FFD324;
	background: #FFF6BF;
	font-size: 12px;
}

div.error p {
	margin: 0;
	color: #000;
	font-weight: normal;
}

div.error p em {
	font-style: normal;
	font-weight: bold;
	padding-left: 24px;
	display: block;
	color: #C00;
	background: url(images/error.gif) no-repeat 0;
}

div.error.ul {
	margin-left: 24px;
}

.online {
	color: #15A018;
}

.offline {
	color: #ed0000;
}

.pagination {
	font-size: 11px;
	padding-top: 10px;
	margin-bottom: 5px;
}

.tfoot .pagination, .tcat .pagination {
	padding-top: 0;
}

.pagination .pages {
	font-weight: bold;
}

.pagination .pagination_current, .pagination a {
	padding: 2px 6px;
	margin-bottom: 3px;
}

.pagination a {
	border: 1px solid #81A2C4;
}

.pagination .pagination_current {
	background: #F5F5F5;
	border: 1px solid #81A2C4;
	font-weight: bold;
	color: #000;
}

.pagination a:hover {
	background: #F5F5F5;
	text-decoration: none;
}

.thread_legend, .thread_legend dd {
background-color:rgba(251,248,239,0.8);
border: 1px solid #321400;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: 5px;
padding: 8px;
}

.thread_legend dd {
	padding-bottom: 4px;
	margin-right: 15px;
}

.thread_legend img {
	margin-right: 4px;
	vertical-align: middle;
}

.forum_legend, .forum_legend dt, .forum_legend dd {
	margin: 0;
	padding: 0;
}

.forum_legend dd {
	float: left;
	margin-right: 10px;
}

.forum_legend dt {
	margin-right: 10px;
	float: left;
}

.success_message {
	color: #00b200;
	font-weight: bold;
	font-size: 10px;
	margin-bottom: 10px;
}

.error_message {
	color: #C00;
	font-weight: bold;
	font-size: 10px;
	margin-bottom: 10px;
}

.post_body {
	padding: 5px;
}

.post_content {
	padding: 5px 10px;
}

.quick_jump {
	background: url(images/jump.gif) no-repeat 0;
	width: 13px;
	height: 13px;
	padding-left: 13px; /* amount of padding needed for image to fully show */
	vertical-align: middle;
	border: none;
}

.repbox {
	font-size:16px;
	font-weight: bold;
	padding:5px 7px 5px 7px;
}

._neutral {
	background-color:#FAFAFA;
	color: #999999;
	border:1px solid #CCCCCC;
}

._minus {
	background-color: #FDD2D1;
	color: #CB0200;
	border:1px solid #980201;
}

._plus {
	background-color:#E8FCDC;
	color: #008800;
	border:1px solid #008800;
}

.pagination_breadcrumb {
	background-color: #f5f5f5;
	border: 1px solid #fff;
	outline: 1px solid #ccc;
	padding: 5px;
	margin-top: 5px;
	font-weight: normal;
}

.pagination_breadcrumb_link {
	vertical-align: middle;
	cursor: pointer;
}

.topbar {
	background: url(images/metin2/topbar_bg.png)no-repeat;
	width: 1439px;
        height: 70px;
	color: #fff;
	padding: 0 0 0 0;
	margin: auto auto;
        font-size:17px;
}

.topbar a:link {
color: white;
	text-decoration: underline;
}

.topbar a:visited {
color: white;
	text-decoration: underline;
}

.topbar a:hover, .navigation a:active {
color: white;
	text-decoration: none;
}

.topbar .active {
	color: white;
	font-size: 13px;
	font-weight: bold;
}

.home {
vertical-align: middle;
position: absolute;
margin-left: 2px;
}

.forumdesc {
    background: rgba(0, 0, 0, 0.5);
    padding: 4px;
    border-radius: 4px;
    -moz-border-radius: 4px;
}

.logocont {
	padding-top: 20px;
padding-left: 14px;
}

.redtable {
          background: url(images/metin2/tablenews.png);
          border: 1px solid #000000;
          width: 975px;
          height: 200px;
          text-align: top;
}

.modnotice {
	background: #F5DA81;
	padding: 8px;
	margin: auto auto;
	border: 2px solid #29220A;
	color: #000000;
	font-size: 12px;
        font-weight: bold;
}

.button {
    font-weight: bold;
    font-size: 14px;
    background: url(images/TarBorder.gif) repeat-x bottom left!important;
    color: #000;
    padding: 2px 3px;
    border: 1px solid #bababa;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.button:link, .button:visited {
    color: #000;
    text-decoration: none;
}

.button:hover {
    color: #007ecf;
    text-decoration: none;
    border: 1px solid #777;
}

.button:active {
    color: #007ecf;
    text-decoration: none;
    border: 1px solid #777;
} 
		
.admin_cp {
    font-weight: bold;
    font-size: 14px;
    background: url(images/metin2/admin_cp.png) no-repeat-x;
    color: #000;
    padding: 2px 3px;
    border: 1px solid #bababa;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}		

.firma{
border: 1px solid #CCA383;
width: 75%;
background: #F7F2E0;
padding: 7px;
text-align: justify;
margin-left: 10%;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
}

.firma_legenda {
border: 1px solid #CCA383;
background: #F5DA81;
padding: 5px;
margin-bottom: 5px;
font-weight: bold;
text-align: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}

div.hr {
  height: 15px;
  background: url(images/metin2/separador.png) no-repeat scroll center;
}
div.hr hr {
  display: none;
}

.postbit4_header {
background-color:rgba(251,248,239,0.8);
width: 130px;
color: #666;
border-bottom: 1px solid #bebebe;
font-size: 11px;
line-height: 2;
text-shadow: 1px 1px 0 #fff;
border-top: 1px solid #999999;
border-bottom: 1px solid #bebebe;
border-left: 1px solid #999999;
border-right: 1px solid #999999;
margin-top: 5px;
padding: 5px 10px;
text-align: center;
font-size: 11px;
font-weight: bold;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
box-shadow: 0 0 1em #b6b6b6;
-moz-box-shadow: 0 0 1em #b6b6b6;
-webkit-box-shadow: 0 0 1em #b6b6b6;
}

#mask {
    position: absolute;
    z-index: 9010;
    background-color: #000000;
    display: none;
    top: 0;
    left: 0;
}

.modalBox {
    position: fixed;
    width: 440px;
    display: none;
    z-index: 9015;
    background: #ffffff;
    border: 1px solid #000000;
    -webkit-box-shadow: 0px 7px 10px 0px rgba(0,0,0,0.81);
    -moz-box-shadow: 0px 7px 10px 0px rgba(0,0,0,0.81);
    box-shadow: 0px 7px 10px 0px rgba(0,0,0,0.81);
}
    .modalBox .thead {
        font-weight: bold;
    }
    .modalBox .modalContent {
        padding: 5px 10px;
}

A greeting.

Euan T

2012-08-04, 11:12 AM
Odd. I can't see anything wrong with it just glancing at it, though I'll take a proper look.

Lummox

2012-08-06, 11:15 AM
Fixed Wink

Thanks for the help.

yasan100

2012-08-06, 07:33 PM
hi tanks to all and big mybb
plz tel me how i creat register box without plugin plz plz

Euan T

2012-08-06, 07:53 PM
Creating one for the register is rather more difficult unless you disable the captcha image and anything else extra (eg: registration security questions).
Pages: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
MyBB Community Forums > Resources > Tutorials > Adding a modal login box to MyBB using jQuery