php - jquery 视口(viewport)大小更改 timthumb 输出

标签 php jquery wordpress resize viewport

我正在使用 timthumb 在 WordPress 站点中显示全屏图库 slider 。我想要做的是调整该图像的大小以适合访客机器的视口(viewport)。目前这些值是静态的。

我知道 php 无法检测视口(viewport)大小,所以我假设我需要使用 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 ?>&amp;h=800&amp;w=1280&amp;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');
});

关于php - jquery 视口(viewport)大小更改 timthumb 输出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9312982/

相关文章:

javascript - jQuery : other links inside div element link

javascript - 将可排序包含限制为表中的特定行

html - Adaptation Wordpress 主题中的最大宽度

php - "Notice: Undefined variable"、 "Notice: Undefined index"、 "Warning: Undefined array key"和 "Notice: Undefined offset"使用 PHP

javascript - 用户返回时如何在提交后填充 INPUT 字段

php - 按行估价计算答案排序结果

javascript - 如何在执行某个 Action 后自动触发回车键按下事件?

html - 将不存在的 index.html 重定向到 Wordpress 中的主页会导致浏览器中的重定向过多

javascript - WordPress 的 jQuery 平滑滚动不起作用

php - 插入新行时避免数据库重复