UI | 输入 | 媒体 | 导航 | 其他 | 网页模板| APP模板| 常用代码| 在线代码

svg动画（原创）

所属分类：其他-动画效果

 50051  467  查看评论 (28)
分享到微信朋友圈
X
svg动画（原创） ie兼容9
 查看演示  立即下载

自己用svg写的一个小动画，svg开发流程是要先用ai画图，然后ai转成svg文件，然后就是写代码了。写得比较粗糙，不懂的可以问我。（建议手机横屏查看，效果更佳）

相关插件-动画效果
查看更多

打字机效果一段文字实现一个个字出现的效果

 10种显示效果可以调节出字速度这样效果又不一样
  动画效果
 35653  435

jQuery点赞+1动画效果

 一款基于jQuery+CSS3实现的点赞+1动画效果，非常实用
  动画效果
 54382  521

HTML5 Canvas粒子效果文字动画特效(酷！)

 HTML5 Canvas粒子效果文字动画特效
  动画效果
 125903  1272

导航水波纹点击效果外加滑动效果

 导航水波纹点击效果外加滑动效果
  动画效果
 35207  422

讨论这个项目（28）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    poeme1990 0
    2020/10/21 21:45:13
    亲爱的，我想学习这个，可不可以聊呀，我的qq是931186511，期待你的回音哈 回复
    JessyTang 0
    2020/8/19 9:28:17
    我晕我为嘛下载了， 打开是空白html 呀， 能私发一个么。。286175887@qq.com 回复
    海上闻樵 0
    2018/11/15 11:55:36
    能否做成自适应呢？横屏用得少，直接打开总是竖屏的多！
        taTA.0
        2018/11/15 11:57:29
        拉伸SVG标签就行 ai设计成竖屏的
        海上闻樵0
        2018/11/17 9:01:09

        我在尝试做成Discuz!手机版广告页，页面fixed，z_in..999；svg部分想放在底部，但是不好定位；

        svg[Attributes Style] {
    x: 0px;
    y: 0px;
    width: 360;
    height: 1185.78;
}

        这个高度 height: 1185.78;能修改吗？

        海上闻樵0
        2018/11/26 17:50:27
        我是一个菜鸟，只能网站上找一些素材，用到自己的网站上。这个动画基本上已经用上去了，效果还不错。非常谢谢楼主了。还有一个问题，每次打开的时候，js报错，Uncaught ReferenceError: stopTime is not defined好像说是终止时间没设置。这个报错在jq22上演示时也同样报错。不知怎么弄好。
    回复
    ?咭、侑?咭 0
    2018/11/14 10:58:39
    你好，为什么我ai画好的文件，转换成svg动画不按照自己的想法渲染出来，而是间断的
        taTA.1
        2018/11/14 11:05:29
        svg动画的轨迹路线 都是用ai做的 前端只是用代码把动画跑起来而已 动画间断你看看ai动画有没有什么问题
    回复
    大心怡果果 0
    2018/11/9 16:50:18
    请问我想把动画里面的颜色变成黑白灰那种的，怎么改
        taTA.0
        2018/11/9 16:51:51
        用ai改最方便，用代码改到你怀疑人生。
        大心怡果果0
        2018/11/9 16:59:37
        我用AI 改了，但是刷新出来没效果
        474179563您加下我QQ吧
    回复
    大心怡果果 0
    2018/11/9 16:04:43
    挺好的，下载下来了
    不过在本地打开的时候，页面是空白的
        taTA.0
        2018/11/9 16:52:25
        要放服务器里面才看得了。
    回复
    北冥有鱼其名为咸 0
    2018/1/1 10:53:48

    导入MyEclipse里转成JSP，加载不出来，是不是这个 http://www.jq22.com/jquery/jquery-1.10.2.js 的问题，有原版查件吗？谢谢大神

        taTA.0
        2018/1/3 10:23:47

        部署IIS服务器试试看。

    回复
    mg张小事儿 0
    2017/11/3 11:22:24

    360急速，谷歌，safari浏览器均不好用

    回复
    supeng1257105495 0
    2017/8/28 17:12:48
    XMLHttpRequest cannot load file:///C:/Users/%E5%95%8A/Desktop/jQuerySvg/img/xiaoshu.svg. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.c.ajax @ snap.svg-min.js:19
main.js:18 Uncaught TypeError: Cannot read property 'attr' of nullc.ajax @ snap.svg-min.js:19
snap.svg-min.js:19 XMLHttpRequest cannot load file:///C:/Users/%E5%95%8A/Desktop/jQuerySvg/img/dashu.svg. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.c.ajax @ snap.svg-min.js:19
main.js:37 Uncaught TypeError: Cannot read property 'attr' of nullc.ajax @ snap.svg-min.js:19
snap.svg-min.js:19 XMLHttpRequest cannot load file:///C:/Users/%E5%95%8A/Desktop/jQuerySvg/img/xiaoshu.svg. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.c.ajax @ snap.svg-min.js:19
main.js:107 Uncaught TypeError: Cannot read property 'select' of null

    怎么办

        taTA.1
        2017/8/28 17:15:16

        部署iis服务器，在服务器上跑，直接跑是加载不出来的。

    回复
    supeng1257105495 0
    2017/8/28 17:11:45
查看更多评论
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
取消回复