让WordPress的发挥 很好的响应图像
2012-04-23 08:58:33 来源：WEB开发网核心提示： WordPress和“流体图像”的问题 正如我敢肯定，你都知道流体图像 -使用最大宽度：100％ -要求图像有没有固定的宽度或高度，让WordPress的发挥 很好的响应图像，他们可以扩展到其容器的大小，不幸的是，所以我们都可以受益， 我希望这是有益的，WordPress会自动计算出从媒体库中
WordPress和“流体图像”的问题
正如我敢肯定，你都知道流体图像 -使用最大宽度：100％ -要求图像有没有固定的宽度或高度，他们可以扩展到其容器的大小。不幸的是，WordPress会自动计算出从媒体库中生成的图像的尺寸，并增加了相应的宽度和高度属性的任何<img>标签。
这是伟大的网页渲染速度，但它抛出一个庞大的工程扳手，当它来创建响应布局，图像尺寸不再限制其容器的大小。
这是一个问题。
非jQuery的解决方案
杰西在他的文章“使用jQuery删除页面上的所有<img>标签的宽度和高度属性，一旦它已载入。这当然可以，但建立我的网站时，我不喜欢依赖于JavaScript来实现这一想法，尤其是如果发生问题的网页上有很多的图像。
这是WordPress的过滤器来救援。
WordPress的法典定义一个过滤器：
“......挂钩的WordPress推出之前修改各种类型的文本，将它添加到数据库中，或发送到浏览器屏幕。”
事实证明，这正是我们需要。通过建立一个过滤器上运行的最后行动之前，他们在页面上呈现所有图片，我们可以使用PHP来删除的宽度和高度属性，从而规避需要（潜在的）昂贵的DOM操纵通过JavaScript。
代码
查看源代码
复制代码
/ **
*响应的图像功能
* /
add_filter （ post_thumbnail_html“ ， “remove_thumbnail_dimensions' ， 10 ）;
add_filter （ image_send_to_editor“ ， “remove_thumbnail_dimensions' ， 10 ）;
功能 remove_thumbnail_dimensions （ HTML美元）， {
$ HTML = preg_replace函数（ '/（宽度|高度）= \“ \ D * \“ \ S /' ，“” ， HTML美元）;
返回 $ HTML ;
}
在上述代码中，我们添加两个滤波器使用add_filter功能。第一个参数是我们要挂钩到过滤器，和我们要运行时，过滤器被称为第二个指定的功能。
在我们的代码挂接到两个晦涩的功能：
post_thumbnail_html -图像检索post_thumbnail（）
image_send_to_editor -图像添加到编辑器
然后，我们使用正则表达式删除的宽度和高度属性从图像标记。现在，当我们的图像发送到浏览器，它们可以是完全的“流体”，就像先生Marcotte告诉我们，他们应。
供认
我不得不承认曾使用的概念add_filter移除属性，我不能为我的生活中找到正确的WordPress过滤器挂接到。
很多的搜索后，我终于遇到了这个非常有用的职位， 对 Wordpress 堆栈交易所由纳撒尼尔Taintor提供了约两个过滤器，我需要的信息。
注意事项
据我所知的唯一重大的借鉴这种方法是，它不会删除您的网站上所有图片的宽度和高度属性。我发现这是一个问题，比较特别的gravatar图像WordPress的使用意见。
如果任何人有一个解决这个问题，请发表评论，所以我们都可以受益。
我希望这是有益的，并表现出依赖于JavaScript来实现在WordPress网站的“流体图像”的替代方法。
- ››wordpress在window下完美实现301重定向的方法
- ››wordpress开启注册功能
- ››wordpress在IIS7下启用wp-super-cache的高级功能
- ››WordPress网站优化:replytocom会导致搜索引擎重复...
- ››wordpress的Akismet插件获取API简单方法
- ››WordPress博客创建robots.txt文件及其用法
- ››WordPress代码实现相关文章的几种方法
- ››WordPress模板开发设计插件推荐
- ››Wordpress官方Android程序评测
- ››响应时间缩短九成——4款企业级云安全产品横向评测...
- ››响应MS08-067 Windows系统紧急安全配置指南
- ››发挥J2EE的优势，管理J2EE的世界（上）
中查找“让WordPress的发挥 很好的响应图像”更多相关内容
中查找“让WordPress的发挥 很好的响应图像”更多相关内容更多精彩
赞助商链接
