Skip to content

Commit b569fc4

Browse files
peachananrpeachananr
committed
Fix cross browser
1 parent 31e6dfe commit b569fc4

5 files changed

+57
-49
lines changed

‎demo/jquery.square_menu.js

+22-21
Original file line numberDiff line numberDiff line change
@@ -42,42 +42,43 @@
4242
if ($("body").hasClass("sm-activate")) {
4343
$(".sm-menu").find(".sm-nav").removeClass("animated")
4444
$(".sm-menu").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){
45-
$("body").removeClass("sm-activate")
45+
$("body").removeClass("sm-activate").find(".sm-menu").removeClass("ff-hack")
4646
});
4747
}
4848
}
4949

5050
$.fn.openMenu = function() {
5151

52-
$(".sm-menu").addClass("animated")
52+
$(".sm-menu").addClass("animated").addClass("ff-hack")
5353

5454
if (!$("body").hasClass("sm-activate")) {
5555
if ($(".sm-overlay").length < 1) $("<div class='sm-overlay'></div>").hide().prependTo("body")
5656
$(".sm-overlay").fadeIn("fast", function() {
5757
$("body").addClass("sm-activate")
58-
$("div.sidemenu.sm-menu.sm-bottom.sm-vertical.animated").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(e){
59-
console.log(e.originalEvent)
60-
if (e.originalEvent.propertyName == 'top' || e.originalEvent.propertyName == 'left') {
61-
$(".sm-menu .sm-nav").addClass("animated");
62-
$(".sm-menu .sm-nav").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(e){
63-
if (e.originalEvent.propertyName == '-webkit-transform' || e.originalEvent.propertyName == 'transform' || e.originalEvent.propertyName == '-o-transform' || e.originalEvent.propertyName == '-moz-transform') {
64-
65-
if (settings.closeButton != false) {
66-
el.prepend("<a href='#' class='sm-close'>" + settings.closeButton + "</a>")
58+
var fired = false;
59+
$("body").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(e){
60+
if ( ! fired ) {
61+
fired = true;
62+
$(".sm-menu .sm-nav").addClass("animated");
63+
$(".sm-menu .sm-nav").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(e){
64+
if (e.originalEvent.propertyName == '-webkit-transform' || e.originalEvent.propertyName == 'transform' || e.originalEvent.propertyName == '-o-transform' || e.originalEvent.propertyName == '-moz-transform') {
65+
66+
if (settings.closeButton != false) {
67+
el.prepend("<a href='#' class='sm-close'>" + settings.closeButton + "</a>")
68+
69+
$(".sm-close").click(function() {
70+
el.closeMenu();
71+
return false;
72+
});
73+
}
6774

68-
$(".sm-close").click(function() {
75+
$(".sm-menu .sm-nav:first-child .nav-inner").addClass("animated flyInLeft")
76+
$(".sm-menu .sm-nav:nth-child(2) .nav-inner").addClass("animated flyInRight")
77+
$(".sm-overlay:not(.clicked)").addClass("clicked").click(function() {
6978
el.closeMenu();
70-
return false;
7179
});
7280
}
73-
74-
$(".sm-menu .sm-nav:first-child .nav-inner").addClass("animated flyInLeft")
75-
$(".sm-menu .sm-nav:nth-child(2) .nav-inner").addClass("animated flyInRight")
76-
$(".sm-overlay:not(.clicked)").addClass("clicked").click(function() {
77-
el.closeMenu();
78-
});
79-
}
80-
});
81+
});
8182
}
8283
});
8384
});

‎demo/square_menu.css

+2-2
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ body.sm-activate {
3838
}
3939

4040

41-
.sm-activate .sm-menu {
41+
.sm-menu.ff-hack {
4242
opacity: 1;
4343
visibility: visible;
4444
top: 50%;
@@ -50,7 +50,7 @@ body.sm-activate {
5050
-moz-transform: translate3d(50%, 0, 0) scale(0.002, 1);
5151
-ms-transform: translate3d(50%, 0, 0) scale(0.002, 1);
5252
-o-transform: translate3d(50%, 0, 0) scale(0.002, 1);
53-
transform: translate3d(50%, 0, 0);
53+
transform: translate3d(50%, 0, 0) scale(0.002, 1);
5454
-webkit-transition: all 0.5s ease-in-out;
5555
-moz-transition: all 0.5s ease-in-out;
5656
-o-transition: all 0.5s ease-in-out;

‎jquery.square_menu.js

+22-19
Original file line numberDiff line numberDiff line change
@@ -42,40 +42,43 @@
4242
if ($("body").hasClass("sm-activate")) {
4343
$(".sm-menu").find(".sm-nav").removeClass("animated")
4444
$(".sm-menu").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){
45-
$("body").removeClass("sm-activate")
45+
$("body").removeClass("sm-activate").find(".sm-menu").removeClass("ff-hack")
4646
});
4747
}
4848
}
4949

5050
$.fn.openMenu = function() {
51-
$(".sm-menu").addClass("animated")
51+
52+
$(".sm-menu").addClass("animated").addClass("ff-hack")
5253

5354
if (!$("body").hasClass("sm-activate")) {
5455
if ($(".sm-overlay").length < 1) $("<div class='sm-overlay'></div>").hide().prependTo("body")
5556
$(".sm-overlay").fadeIn("fast", function() {
5657
$("body").addClass("sm-activate")
58+
var fired = false;
5759
$("body").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(e){
58-
if (e.originalEvent.propertyName == 'top' || e.originalEvent.propertyName == 'left') {
59-
$(".sm-menu .sm-nav").addClass("animated");
60-
$(".sm-menu .sm-nav").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(e){
61-
if (e.originalEvent.propertyName == '-webkit-transform') {
62-
63-
if (settings.closeButton != false) {
64-
el.prepend("<a href='#' class='sm-close'>" + settings.closeButton + "</a>")
60+
if ( ! fired ) {
61+
fired = true;
62+
$(".sm-menu .sm-nav").addClass("animated");
63+
$(".sm-menu .sm-nav").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(e){
64+
if (e.originalEvent.propertyName == '-webkit-transform' || e.originalEvent.propertyName == 'transform' || e.originalEvent.propertyName == '-o-transform' || e.originalEvent.propertyName == '-moz-transform') {
65+
66+
if (settings.closeButton != false) {
67+
el.prepend("<a href='#' class='sm-close'>" + settings.closeButton + "</a>")
68+
69+
$(".sm-close").click(function() {
70+
el.closeMenu();
71+
return false;
72+
});
73+
}
6574

66-
$(".sm-close").click(function() {
75+
$(".sm-menu .sm-nav:first-child .nav-inner").addClass("animated flyInLeft")
76+
$(".sm-menu .sm-nav:nth-child(2) .nav-inner").addClass("animated flyInRight")
77+
$(".sm-overlay:not(.clicked)").addClass("clicked").click(function() {
6778
el.closeMenu();
68-
return false;
6979
});
7080
}
71-
72-
$(".sm-menu .sm-nav:first-child .nav-inner").addClass("animated flyInLeft")
73-
$(".sm-menu .sm-nav:nth-child(2) .nav-inner").addClass("animated flyInRight")
74-
$(".sm-overlay:not(.clicked)").addClass("clicked").click(function() {
75-
el.closeMenu();
76-
});
77-
}
78-
});
81+
});
7982
}
8083
});
8184
});

‎jquery.square_menu.min.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎square_menu.css

+10-6
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ body.sm-activate {
3838
}
3939

4040

41-
.sm-activate .sm-menu {
41+
.sm-menu.ff-hack {
4242
opacity: 1;
4343
visibility: visible;
4444
top: 50%;
@@ -50,10 +50,10 @@ body.sm-activate {
5050
-moz-transform: translate3d(50%, 0, 0) scale(0.002, 1);
5151
-ms-transform: translate3d(50%, 0, 0) scale(0.002, 1);
5252
-o-transform: translate3d(50%, 0, 0) scale(0.002, 1);
53-
transform: translate3d(50%, 0, 0);
53+
transform: translate3d(50%, 0, 0) scale(0.002, 1);
5454
-webkit-transition: all 0.5s ease-in-out;
55-
-moz-transition: all 0.5s;
56-
-o-transition: all 0.5s;
55+
-moz-transition: all 0.5s ease-in-out;
56+
-o-transition: all 0.5s ease-in-out;
5757
transition: all 0.5s ease-in-out;
5858
width: 50%;
5959
height: 100%;
@@ -82,8 +82,12 @@ body.sm-activate {
8282
.sm-menu .sm-nav .nav-inner{
8383
display: none;
8484
-webkit-animation-duration: 1s;
85+
-moz-animation-duration: 1s;
86+
-o-animation-duration: 1s;
8587
animation-duration: 1s;
8688
-webkit-animation-fill-mode: both;
89+
-moz-animation-fill-mode: both;
90+
-o-animation-fill-mode: both;
8791
animation-fill-mode: both;
8892
vertical-align: middle;
8993
white-space: normal;
@@ -169,8 +173,8 @@ body.sm-activate {
169173
overflow: hidden;
170174
visibility: hidden;
171175
-webkit-transition: all 0.5s ease-in-out;
172-
-moz-transition: all 0.5s;
173-
-o-transition: all 0.5s;
176+
-moz-transition: all 0.5s ease-in-out;
177+
-o-transition: all 0.5s ease-in-out;
174178
transition: all 0.5s ease-in-out;
175179
}
176180

0 commit comments

Comments
 (0)