CSS Buttons for 1.X

[brianmccoy]

Hi Audentio
Thanks for this helpful tutorial, but there is a bit problem in multi-quote button. I copied the code in headerinclude template, CSS in global.css and the code for multi-quote you gave in the postbit_multiquote template.

The multi-quote button is working fine, but when I click/select the multi-quote button, it is not changing its color as desired. Its color remains same whether its selected or deselected. Where am I wrong??

---

now it is working with some tweaks
Put the following code at top of "header" template

Code:

<script type="text/javascript">
jQuery(document).ready(function($) {
if( $.cookie('multiquote') !== null ) {
    var quoted = $.cookie("multiquote");
    var quoted_split = quoted.split('|');
    jQuery.each(quoted_split, function() {
        $('#multiquote_link_' + this).addClass('multiquote_on');
    });
}
$('a.button_multiquote').click(function() {
    if($(this).hasClass('multiquote_on')) {
        $(this).removeClass('multiquote_on');
    } else {
        $(this).addClass('multiquote_on');
    }
});
});
</script>

And put this code in "headerinclude" template above {$stylesheets}

Code:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/jquery.cookie.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/sidebar.js"></script>

@Audentio : also add a:hover.large_button besides a:hover.postbit_button in the CSS stylesheet