ページの読み込みポップアップ

Question

現在、私はこれを持っており、モバイルには最適ですが、サイズはデスクトップにとっては小さすぎます。

<!-- Main Stylesheet --> 
<p><link href="/adpopup-pro.min.css" rel="stylesheet" media="screen" type="text/css" /></p> 

<!-- jQuery (load only if needed) --> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 

<!-- Main Javascript --> 
<script type="text/javascript" src="/adpopup-pro.min.js"></script> 
<script type="text/javascript">// <![CDATA[ 

$(document).ready(function() { 

    var ads = { 
     'ad_1': { 
     'type': 'image', 
     'src': 'imagelink', 
     'link': 'link', 
     } 

    } 

    $('body').adPopupPro({ 
     ads: ads, 
     width:320, 
     height:320, 
     overlay_color:'dark', 
    }); 
    }); 
// ]]></script> 

どういうわけかこれを囲み、モバイルでのみ読み込みを行い、デスクトップとそれ以上のサイズで別のものを読み込むことはありますか？

Answer 1

あなたはこの

/* Smartphones (portrait and landscape) ----------- */ 
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) { 

} 

/* Desktops and laptops ----------- */ 
@media only screen 
and (min-width : 1224px) { 

} 

/* Large screens ----------- */ 
@media only screen 
and (min-width : 1824px) { 

} 

EDITのようにそれを行うことができます：ここにあなたの広告に異なる値をお使いのユーザーエージェント解像度によって確認し、取得するために、これを試してみてください似た答え How to auto adjust the div size for all mobile/tablet display formats?

Answer 2

とのリンクあり幅と高さ。

$(document).ready(function() { 

    var ads = { 
     'ad_1': { 
     'type': 'image', 
     'src': 'imagelink', 
     'link': 'link', 
     } 

    } 

    $('body').adPopupPro({ 
     ads: ads, 
     width:(function(){ 
     if(window.innerWidth>768){ //could be any breakpoint value! 
      var width = 320; 
     } 
     else{ 
      var width = 200; 
     } 
     return width; 
     })(), 
     height: (function(){ 
     if(window.innerWidth<768){ //could be any breakpoint value! 
      var height = 320; 
     } 
     else{ 
      var height = 200; 
     } 
     return width; 
     })(), 
     overlay_color:'dark', 
    }); 
}); 
// ]]>