First apologize for my English. I have a popup when I do click in triggerPop this one it appears, I'm trying to show this one to the right but the css doesn't work. What am I doing wrong? Thank you in advance.
var monscreen = $(window).width();
var mondoc = $(document).width();
if (mondoc > monscreen) {
var dif = mondoc - monscreen;
$("div#Navigation_Popup").css({
'right': dif + 'px'
});
}
$(function() {
$('#triggerPop').bind('click', function(e) {
$("#Navigation_Popup").slideFadeToggle(function() {});
return false;
});
$.fn.slideFadeToggle = function(easing, callback) {
return this.animate({
opacity: 'toggle',
height: 'toggle'
}, "fast", easing, callback);
}
});
I'm going off of the limited information. You mentioned css
...
I would move all of this code:
var monscreen = $(window).width();
var mondoc = $(document).width();
if (mondoc > monscreen) {
var dif = mondoc - monscreen;
$("div#Navigation_Popup").css({
'right': dif + 'px'
});
}
Inside of
$(function(){
.
.
.
});
As it is now, the if (mondoc > monscreen)
code block is getting executed before the document is ready.
Not sure how jquery treat these values but, isnt var monscreen = $(window).width(); var mondoc = $(document).width(); returning strings? How about an alert to check this?
Bind is deprecated, try on instead. I also think everything should be inside $(function()) handler, so, try this:
$(function() {
var monscreen = $(window).width();
var mondoc = $(document).width();
if (mondoc > monscreen) {
var dif = mondoc - monscreen;
$("div#Navigation_Popup").css({
'right': dif + 'px'
});
}
$('#triggerPop').on('click', function(e) {
$("#Navigation_Popup").slideFadeToggle(function() {});
return false;
});
$.fn.slideFadeToggle = function(easing, callback) {
return this.animate({
opacity: 'toggle',
height: 'toggle'
}, "fast", easing, callback);
}
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.