jQuery SVG图像插件SVGMagic

所属分类：媒体-图像

47553 287 查看评论 (2)

分享到微信朋友圈

查看演示 website 立即下载

插件描述：这种易于使用的jQuery插件将创建一个后备SVG图像到您的网站上。当插件注意到访问者的浏览器不支持SVG图像,将更换新的PNG图像。

这种易于使用的jQuery插件将创建一个后备SVG图像到您的网站上。当插件注意到访问者的浏览器不支持SVG图像,将更换新的PNG图像。这些，PNG图像是使用服务器端脚本运行创建的。当访问者浏览器的支持。SVG图像它只是回去睡觉了。

SVGMagic的一大好处是，你不必创建多个版本的图像。你可以只专注于SVG图像，让SVGMagic来帮你处理兼容问题。

SVG 是什么/为什么要用？

SVG是一个矢量图形格式，这意味着它是完全可扩展的。不论大小，它需要显示时，或任何屏幕需要显示上，一个SVG将适应完美。这意味着你可以使用同样的图像桌面和移动（包括视网膜）的游客。他们都得到了完美清晰的图像。

安装

只是包括脚本在你的头，并调用该插件在你的$(document).ready()

<script src="SVGMagic.min.js"></script>
<script>
    $(document).ready(function(){
        $('img').svgmagic();
    });
</script>

svgmagic也支持backgroundimages。你需要解析div,包含背景包括背景选项。

<script src="SVGMagic.min.js"></script>
<script>
    $(document).ready(function(){
        $('.bgimage').svgmagic({
            backgroundimage: true
        });
    });
</script>

选项

你可以分析一个选项对象到SVGMagic。目前，它支持下面的选项：

$('img').svgmagic({
    preloader: {url-to-preloader/false}, // 图像被替换//预加载前，默认：false
    testmode: {false/true}, //SVGMagic工作在每一个浏览器，如果设置为true，默认：false
    secure: {false/true}, // 图像通过https://开头发送，如果设置为true，默认：false
    backgroundimage: {false/true}, //检查给定格为backgroundimages，默认：false
    callback: {false/function} //函数回调图像后，运行被改变，默认：false
    dumpcache: {false/true} //强制删除缓存并创建一个新的PNG，默认值：假
});