2014-09-20 161 views
0

完全披露,我知道刚刚足够的css导致真正的损害。固定响应大小的声音嵌入播放器

我希望soundcloud嵌入式播放器在桌面上很大,在手机上很小。我似乎无法完成这项工作。固定大小看起来令人惊讶的桌面上,但在移动过大:

http://jmobley23.wpengine.com/project/veronica-mars-movie/

具有最大宽度和高度设置为%100的球员看上去很不错的手机,但在桌面上过小:

http://jmobley23.wpengine.com/project/hateful-8-trailer/

对于爱神之人,我该如何解决?

感谢您提供的任何帮助。

+0

请发布您的一些CSS或一些相关的代码,以帮助社区帮助您 – Matt 2014-09-20 18:28:35

+0

我唯一真正拥有的是嵌入代码。尽管我在Wordpress中弄脏了填充和对象容器的大小,但那是一个死路一条。因此,真的没有什么可显示的。 – jmob 2014-09-20 18:49:25

回答

0

您可以在body tag添加一些mobile detection类,你的主题header.php必须有:

<body <?php body_class(); ?>> 

然后在functions.php添加过滤器:

add_filter('body_class', 'body_class_so_25951935'); 

function body_class_so_25951935($classes) { 
    if(wp_is_mobile()) { 
     $classes[] = 'mobile'; 
    } else { 
     $classes[] = 'desktop'; 
    } 
    return $classes; 
} 

最后,CSS:

body.mobile .soundcloud-object { 
    /* your rules */ 
} 

移动检测可以用MobileDetect之类的东西进行微调,如blog post所示。