Lastbreath Posted March 10, 2014 Share Posted March 10, 2014 Hi, i created website in wich i have a quiz of 5 questions with next button and a progress bar, now im at the media queries part, and have a wierd issue, the issue is with the filling of the progress bar, in chrome is ok in both sizes work well, but in mozilla for some reason it calculates x2 ? anyone to explain why and maybe sugges fix, im googling for 2h cant find anything. Tnx the code: <script type="text/javascript"> $(window).resize(function(){ var wi = $(window).width(); if(wi >= 1025){ $(function(){ $('.btnNext, .btnShowResult').click(function(){ if ($('input[type=radio]:checked:visible').length == 0) { return false; } $(this).parents('.questionContainer').fadeOut(500, function(){ $(this).next().fadeIn(500); }); var el = $('#progress'); el.width(el.width() + 84 + 'px'); }); $('.btnShowResult').click(function(){ $('#progress').width(420); $('#progressKeeper').fadeOut(500); $('.txtStatusBar').fadeOut(500); $('.circletimer').fadeOut(500); }); }); } else { if(wi >= 768 && wi <= 1024){ $(function(){ $('.btnNext, .btnShowResult').click(function(){ if ($('input[type=radio]:checked:visible').length == 0) { return false; } $(this).parents('.questionContainer').fadeOut(500, function(){ $(this).next().fadeIn(500); }); var el = $('#progress'); el.width(el.width() + 60 + 'px'); }); $('.btnShowResult').click(function(){ $('#progress').width(300); $('#progressKeeper').fadeOut(500); $('.txtStatusBar').fadeOut(500); $('.circletimer').fadeOut(500); }); }); } } }).resize(); </script> Link to comment https://forums.phpfreaks.com/topic/286866-jquery-progress-bar-chrome-ok-mozilla-x2-width/ Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.