So, I've got this code:
$(document).ready(function(){
var case_menu = 0;
var case_heading = 0;
var case_headerbar = 0;
$(".spinner-spin2").click(function(){
if (case_menu == 0){ // initial status
$(".menu").addClass("showmenu");
$(".headingwrapper").addClass("extraspace");
$(".logo").removeClass("logo_animation_long");
$(".logo").addClass("logo_animation_short");
$(".logo").addClass("logovisibility");
$(".logo_blackedout").removeClass("blacklogo_animation_short");
$(".logo_blackedout").addClass("blacklogo_animation_long");
$(".logo_blackedout").addClass("blacklogovisibility");
$(".navfooter").removeClass("navfooter_animation_short");
$(".navfooter").addClass("navfooter_animation_long");
$(".navfooter").addClass("navfooter_visibility");
$(".menu .bottom").removeClass("bottom_animation_short");
$(".menu .bottom").addClass("bottom_animation_long");
$(".menu .bottom").addClass("bottomvisibility");
$(".headerbar").addClass("extraspace2");
$(".headerbar").removeClass("header_animation_comein");
$(".headerbar").removeClass("header_animation_goout");
$(".headerbar").addClass("header_animation_spacer");
} else (case_menu == 1){ // status: menu out
$(".menu").removeClass("showmenu");
$(".headingwrapper").removeClass("extraspace");
$(".logo_blackedout").removeClass("blacklogo_animation_long");
$(".logo_blackedout").addClass("blacklogo_animation_short");
$(".logo_blackedout").removeClass("blacklogovisibility");
$(".logo").removeClass("logo_animation_short");
$(".logo").addClass("logo_animation_long");
$(".logo").removeClass("logovisibility");
$(".navfooter").removeClass("navfooter_animation_long");
$(".navfooter").addClass("navfooter_animation_short");
$(".navfooter").removeClass("navfooter_visibility");
$(".menu .bottom").removeClass("bottom_animation_long");
$(".menu .bottom").addClass("bottom_animation_short");
$(".menu .bottom").removeClass("bottomvisibility");
$(".headerbar").removeClass("header_animation_comein");
$(".headerbar").removeClass("header_animation_goout");
$(".headerbar").addClass("header_animation_spacer");
$(".headerbar").removeClass("extraspace2");
} else if{
}
});
});
It's included in my index.php and should just apply some css-transitions concerning the sidemenu when the menu-button is clicked. All it does is nothing, so that's why I'm here.
Previously, I had this code, which worked fine:
function logo_handler1() {
$(".menu").addClass("showmenu");
$(".headingwrapper").addClass("extraspace");
$(".logo").removeClass("logo_animation_long");
$(".logo").addClass("logo_animation_short");
$(".logo").addClass("logovisibility");
$(".logo_blackedout").removeClass("blacklogo_animation_short");
$(".logo_blackedout").addClass("blacklogo_animation_long");
$(".logo_blackedout").addClass("blacklogovisibility");
$(".navfooter").removeClass("navfooter_animation_short");
$(".navfooter").addClass("navfooter_animation_long");
$(".navfooter").addClass("navfooter_visibility");
$(".menu .bottom").removeClass("bottom_animation_short");
$(".menu .bottom").addClass("bottom_animation_long");
$(".menu .bottom").addClass("bottomvisibility");
$(".headerbar").addClass("extraspace2");
$(".headerbar").removeClass("header_animation_comein");
$(".headerbar").removeClass("header_animation_goout");
$(".headerbar").addClass("header_animation_spacer");
$(".spinner-spin2").one("click", logo_handler2);
}
function logo_handler2() {
$(".menu").removeClass("showmenu");
$(".headingwrapper").removeClass("extraspace");
$(".logo_blackedout").removeClass("blacklogo_animation_long");
$(".logo_blackedout").addClass("blacklogo_animation_short");
$(".logo_blackedout").removeClass("blacklogovisibility");
$(".logo").removeClass("logo_animation_short");
$(".logo").addClass("logo_animation_long");
$(".logo").removeClass("logovisibility");
$(".navfooter").removeClass("navfooter_animation_long");
$(".navfooter").addClass("navfooter_animation_short");
$(".navfooter").removeClass("navfooter_visibility");
$(".menu .bottom").removeClass("bottom_animation_long");
$(".menu .bottom").addClass("bottom_animation_short");
$(".menu .bottom").removeClass("bottomvisibility");
$(".headerbar").removeClass("header_animation_comein");
$(".headerbar").removeClass("header_animation_goout");
$(".headerbar").addClass("header_animation_spacer");
$(".headerbar").removeClass("extraspace2");
$(".spinner-spin2").one("click", logo_handler1);
}
$(".spinner-spin2").one("click", logo_handler1);
It does just the same as the new code did, but since I have to handle more cases of transitions now, I wanted to transform this into if-statements which should apply the correct transition-code and transitions based on what situation is present.
I can't see anything wrong with the new code or I just overlooked something... Can you help?
Aucun commentaire:
Enregistrer un commentaire