php – SVG / PNG扩展开关

发布时间：2020-12-13 17:21:33 所属栏目：PHP教程来源：网络整理

导读：有没有办法在我的网站上使用SVG图像,如果浏览器/设备不支持它,请将扩展名切换为png？有一个更好的方法吗？注意：我正在使用 img标签和Modernizr. 这是我的代码,动态地吐出图像. ?php $attachments = attachments_get_attachments(); ? ?php if( function_ex

有没有办法在我的网站上使用SVG图像,如果浏览器/设备不支持它,请将扩展名切换为png？有一个更好的方法吗？

注意：我正在使用< img>标签和Modernizr.

这是我的代码,动态地吐出图像.

<?php $attachments = attachments_get_attachments(); ?>
        <?php if( function_exists( 'attachments_get_attachments' ) ) {
        $attachments = attachments_get_attachments();
        $total_attachments = count( $attachments ); if( $total_attachments ) : ?><?php for( $i=0; $i<$total_attachments; $i++ ) : ?>
<img src="<?php echo $attachments[$i]['location']; ?>" alt="<?php echo $attachments[$i]['title']; ?>" class="full" />
<?php endfor; ?><?php endif; ?><?php } ?>

输出以下内容：
< img src =“http://mysiteurl.net/image.png”alt =“Image Title”class =“full wp-image-287”/>

解决方法

我想你可以测试是否支持svg,如果没有循环你的图像标签并将其src路径设置为.png.此示例尚未经过测试,但可能是朝着正确方向迈出的一步.

if(!Modernizr.svg){
  var images = document.getElementsByTagName("img");
  for(var i = 0; i < images.length; i++){
    var src = images[i].src.split(".");
    images[i].src = src[0] + ".png";
  }
}

如果jQuery是一个选项,那么这样的事情可能是这样的：

if(!Modernizr.svg){
  $("img").each(function(){
    var src = this.src.split(".");
    this.src = src[0] + ".png";
  });
}

编辑

您也可以考虑查看Modernizr-Server.这样您可以在循环浏览图像时测试svg并附加相应的扩展名.

if ($modernizr->svg) {
    ...
} elseif ($modernizr->canvas) {
    ...
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!