Home
Publications
0
Posted Mon Aug 17, 2015 12:36 am
Details: I have this js code to made the code box collapsible, and it's morking fine but the issue is that when I toogle one the rest of the code boxes open too at the same time. How can I prevent this? I know there's something I'm missing in this code but I can't find what it is, hope someone could help me.
This is the code I'm ussing:
Screenshot:
Forum Address: http://loseyourmindskin1.forosinvision.com/
Forum Version: Phpbb3
This is the code I'm ussing:
- Code:
var expand_qc = "<img src='http://i18.servimg.com/u/f18/19/22/43/68/expand10.gif' />";
var collapse_qc = "<img src='http://i18.servimg.com/u/f18/19/22/43/68/collap10.gif' />";
var collapsible_codes = true;
var code_auto_hide = true;
$(document).ready(function(){
var check_post = $(".postbody");
$(check_post).each(function(){
var check_number = $(this).children(".postbody .content").length;
for(var i=0;i <= check_number; i++){
if($(this).has("dl.codebox:not(.spoiler,.hidecode)")){
$("dl.codebox:not(.spoiler,.hidecode)").addClass("code-wrapper");
$("dl.codebox:not(.spoiler,.hidecode) dt").addClass("code-header");
$("dl.codebox:not(.spoiler,.hidecode) dd code").addClass("my-code");
}
}
});
$(".code-header").append("<span class='code-grab'>(Selecciónalo todo)</span>");
$(".code-grab").click(function(x){
var code_text = $(this).parents("dt:first").next("dd").children("code");
code_text.each(function() {
if(document.body.createTextRange){
var code_range = document.body.createTextRange();
code_range.moveToElementText(this);
code_range.select();
} else if (window.getSelection) {
selection = window.getSelection();
code_range = document.createRange();
code_range.selectNodeContents(this);
selection.removeAllRanges();
selection.addRange(code_range);
}
});
x.stopPropagation();
});
if(collapsible_codes == true){
$(".code-header").append("<span class='selectCode'> <span class='code-toggle' style='display:none'>"+expand_qc+"</span><span class='code-toggle'>"+collapse_qc+"</span></span>");
if(code_auto_hide == true) {
$("code.my-code").hide();
$(".code-header").children(".selectCode").children("span.code-toggle").toggle();
$(".code-header").children(".code-grab").toggle();
}
}
$(".selectCode").click(function(){
$("code.my-code").toggle();
$("span.quote-toggle").toggle();
$(".code-grab").toggle();
});
});
Screenshot:
Forum Address: http://loseyourmindskin1.forosinvision.com/
Forum Version: Phpbb3
