jquery 视口大小更改 timthumb 输出

发布于 2025-01-06 09:33:38 字数 723 浏览 1 评论 0原文

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

我知道 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 ?>&amp;h=800&amp;w=1280&amp;zc=1" alt="<?php the_title(); ?>" width="1280" height="800" /></a></div>

请慢慢解释,因为我对 PHP 相当陌生。

I'm using timthumb to display a full screen gallery slider in a wordpress site. What I want to do is resize that image to fit the viewport of the vistors machine. At the moment the values are static.

I know php can't detect viewport size, so I assume I need to use jquery.

   var viewport_Width = $(window).width();
   var viewport_Height = $(window).height();

The problem I have is I don't know how to connect that output to this piece of PHP with static values that tells timthumb how big to make the image:

 <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>

Please explain it slowly as i am fairly new to PHP.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

哭了丶谁疼 2025-01-13 09:33:38

使用 javascript 删除 imgs 的高度和宽度属性,然后使用 CSS 将其宽度和/或高度设置为 100%。

 $('.cover img').each(function(){
    $(this).removeAttr('width')
    $(this).removeAttr('height');
});

Use javascript to remove the height and width attributes of your imgs, and then use CSS to set their width and or height to 100%.

 $('.cover img').each(function(){
    $(this).removeAttr('width')
    $(this).removeAttr('height');
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文