Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

Little help with Panel Box Toggles 1.1 plug in ?

This discussion is related to the Panel Box Toggles addon.
edited April 2016 in Vanilla 2.0 - 2.8

Hi everybody,
I've installed Panel Box plug in on my forum, and I've made a few changes to be like this:

I don't know if it is possible, but I need that when I press "arrow down icon" let me show the discussions containing on "General", "OET" and "Maestros" with the same format as the categories menu that the image shows, I'm rookie as hell doing this, but I want to learn about it

My panelboxtoggles.js is like this

jQuery(document).ready(function($){
// Find all panel boxes
$('#Panel .Depth1:not(.Group)').addClass('PanelBoxToggle');

// Add click handler and trigger it
$('.PanelBoxToggle').click(function(event) {    
    if($(this).children('a').length > 0) { //
        event.preventDefault();
        //ToggleClass shows content
        if($(this).toggleClass('Collapsed')){
            $('.PanelInfo').children().click(function(){
            $(this).children('.ClearFix').slideToggle('slow');     
            }).children('.ClearFix').click(function (event) {
            event.stopPropagation();
            });
            alert('Run this alert to test if "if" works');
        }
        //slideToggle hides the content
        $(this).children(':not(:first-child)').slideToggle();
    }
});

// Collapse all the panels by default
$('.PanelBoxToggle').not('.BoxCategories').children('a ~ *').hide();

// Prevent links from closing the panel box
$('.PanelBoxToggle').click(function(event) {
    event.stopPropagation();
}); 

});

And my panelboxtoggles.css is like this

Panel .Depth1.PanelBoxToggle.Collapsed {

padding-right: 20px;
background-image: url('arrow.png');
background-repeat: no-repeat;
background-position: 95% 9px;

}

Panel .Depth1.PanelBoxToggle {

padding-right: 20px;
background-image: url('arrow-down.png');
background-repeat: no-repeat;
background-position: 95% 9px;

}

Tagged:

Comments

Sign In or Register to comment.