我可以讓我的jQuery響應所有設備嗎？

Question

我處理的移動友好的網站，並使用我申請使用jQuery多個動畫。我寫了jQuery的臺式機以及筆記本也如下：

function mobani1() 
{$("#animate1").fadeIn('slow').animate({'display':'inline- 
block','margin- left':'180px','margin-bottom':'6px'},1000,function(){ 

$('.1st').animate({'opacity': '0.9'},400, 
    function(){$('.1st').animate({'opacity':'1'})})}); 
    $("#animate1").fadeIn('slow').animate({'margin-bottom':'0px','margin-left':'-140px'},1000) 
     .fadeOut('slow');} 

    function mobani2(){ $(".2nd").fadeIn('slow').animate({'margin-left':'20px','margin-bottom':'2px'},'slow',function(){$('.1st').animate({'opacity':'0.5'},1000, 
    function(){$('.1st').animate({'opacity':'1'},'slow')})}).fadeOut(); 
    $(".2nd").fadeIn('slow').animate({'margin-bottom':'0px','margin-left':'-150px'},'slow') 
    .fadeOut('slow');} 

    var interval1=[mobani1,mobani2,mobani3]; 
    var index =0; 
    $(document).ready(function(){ 
       window.setInterval(function(){ 
        interval1[index++ % interval1.length]() 
            },10800); // total time taken by animation is 10800 
    }); 

現在，我有各種移動設備所以在每一個設備，我無法設置margin-leftmargin-bottom按照這裏給出。例如，這裏給出margin-left: 180px但如果我的手機有500像素，800像素寬度不同，會發生什麼？那麼，我怎麼能寫jQuery以上的移動友好版本。

Answer 1

更好的你去媒體查詢爲跨瀏覽器和移動設備。 你可以在W3schools的mediaQueries上了解更多：http://www.w3schools.com/csSref/css3_pr_mediaquery.asp和https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries