我使用timthumb在wordpress网站中显示全屏图库滑块。我想做的是调整图像的大小以适应vistors机器的视口。目前,这些值是静态的。
我知道php无法检测视口大小,所以我认为我需要使用jquery。
var viewport_Width = $(window).width();
var viewport_Height = $(window).height();
我遇到的问题是,我不知道如何将输出连接到这段带有静态值的PHP,这些静态值告诉timthumb制作图像的大小:
<div class="cover"><a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title(); ?>"><img src="<?php bloginfo('template_directory'); ?>/scripts/timthumb.php?src=<?php echo $img ?>&h=800&w=1280&zc=1" alt="<?php the_title(); ?>" width="1280" height="800" /></a></div>
请慢慢解释,因为我对PHP还很陌生。
使用javascript删除imgs的高度和宽度属性,然后使用CSS将其宽度和/或高度设置为100%。
$('.cover img').each(function(){
$(this).removeAttr('width')
$(this).removeAttr('height');
});