SVG Morpheus 正在参加 2020 年度 OSC 中国开源项目评选,请投票支持!
SVG Morpheus 在 2020 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
投票让它出道
已投票
SVG Morpheus 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」 !
SVG Morpheus 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」「最积极运营项目」 !
SVG Morpheus 获得 2020 年度 OSC 中国开源项目评选「最积极运营项目」 !
授权协议 MIT
操作系统 跨平台
软件类型 开源软件
开源组织
地区 不详
投 递 者 叶秀兰
适用人群 未知
收录时间 2014-12-01

软件简介

SVG Morpheus 是 JavaScript 库,允许 SVG 图标变形成另外一个 SVG 图标,实现了 Material Design 的 Delightful Details 转换。 在线演示

SVG Morpheus – Material Design Inspired SVG Icons Morphing Effect

展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论 (0)

加载中
更多评论
暂无内容
2020/12/22 16:32

ansible-modules-morpheus-Morpheus数据的Ansible模-Adam Hicks 环境变量

ansible-modules-morpheus-Morpheus数据的Ansible模-Adam Hicks 发布:2020-12-22 16:32:04.691108 作者:Adam Hicks ### 作者邮箱:ahicks@morpheusdata.com ### 首页:https://github.com/gomorpheus/ansible-modules-morpheus ### 文档:None ### 下载链接 #Ansible模块Morpheus ![最新版本](https://img.shields.io/pypi/v/ansible-modules-morpheus.svg) 安装此模块: *通过pip ``python pip安装ansible模块morpheus *通...

0
0
发表于DevOps专区
2018/08/21 18:28

SVG

SVG 教程 : http://www.runoob.com/svg/svg-tutorial.html SVG教程 : https://www.w3cschool.cn/svg/

0
0
发表于大前端专区
2018/11/22 11:47

SVG

俗话说得好:最好的学习方法是兴趣引导的学习,在学习SVG之前,先给你们看看一些实例,让你们领略一下SVG的强大,看看能不能激发出你们的学习兴趣。 https://www.html5tricks.com/tag/svg/ 感觉怎么样呢?是不是非常想学习SVG,做一个属于自己的作品出来啊?那就开始学习吧。 目录 SVG入门 SVG简介 位图和矢量图 使用方式 SVG的图形和基本属性 基本图形 基本属性 基本操作API 创建图形 添加图形 设置/获取属性: 通过以上属性制...

0
0
发表了博客
2019/06/03 14:23

SVG

SVG:矢量图   canvas:用于绘制位图   svg:使用xml格式绘制图形   svg:要有一个根节点,标签就相当于html   svg:命名空间,xmlns="http://www.w3.org/2000/svg" 版本 version="1.1"   svg如果不设置大小,默认占用位置300X150   定义矩形:rect标签,必填的两个属性 width height   rect的属性:   width:宽   height:高   X:x轴坐标   y:y轴坐标   rx:边框圆角   style=“fill;red”:样式...

0
0
发表了博客
2018/02/05 09:03

SVG_CSS动画.【转】SVG之Animation

1、SVG之Animation - 前端学习笔记 - SegmentFault.html(https://segmentfault.com/a/1190000009371194) 2、 <animate>元素用于实现动画效果(动画截图比较麻烦,本文中的例子最好直接写demo看效果) 基本动画 将<animate>元素嵌入到元素内,来实现该元素的动画效果。 <rect x="10" y="10" width="200" height="20" stroke="black" fill="none"> <animate attributeName="width" attributeType="XML" from="200" to="20" begi...

0
0
发表于大前端专区
2019/05/16 09:22

svg

#Usage <img> # Browser support <img src="image.svg" onerror="this.onerror=null; this.src='image.png'"> #Usage <style> .demo{ background: url(kiwi.svg); } </style> # Browser support body { background: url(fallback.png); background-image: url(image.svg), none; } #hover animation .kiwi { fill: #94d31b; } .kiwi:hover { fill: #ace63c; }...

0
0
发表了博客
2019/10/25 17:54

svg-sprite-loader ( svg-icon) 使用

svg-sprite-loader 可以多个svg图标合并. 使用时只需根据合并的symbol的id即可. <svg class="svg-icon" aria-hidden="true" v-on="$listeners"> <use xlink:href="symbol的id" /> </svg> // 项目使用Vue CLI 搭建 1. 首先 svg-sprite-loader npm install -D svg-sprite-loader 2. 更改vue.config.js webpack的配置 chainWebpack: config => { config.module.rules.delete('svg'); //重点:删除默认配置中处理svg, ...

0
0
发表了博客
2019/05/08 17:36

svg的学习

svg的学习 1,初步了解 1,大致看了一下svg的简介,在图形的操作和展示上有很大的优势,例如不会失精;灵活的dom操作;很好的兼容性(IE需要下载插件)。so,是一门值得深究的前端课程; 2,看了一个小demo,使用xml的语言,创建.svg后缀文件(文件的后缀名可认为是一种标识,文件解析不会按照文件去解析,so html or js or xml解析时,与放在什么样的文件里面是没有关系的) 2,小试牛刀 1,demo总结点;   (1)standalone该...

0
0
2020/01/07 13:41

SVG之path

该部分为四个主要部分:  <text>和<tspan>标签详解  文本水平垂直居中问题  <textpath>让文本在指定路径上排列   <a>插入超链接 <text>和<tspan>标签 <text>和<tspan>标签是定义文本的基本标签。 <text> | 参数 | 描述 | 默认值 | | x | 文本绘制x轴位置 | 0 | | y | 文本绘制y轴位置 | 0 | | dx | 每个字符相对前一个字符的偏移距离 | 0 | | dy | 每个字符相对前一个字符的偏移距离 | 0 | 例子: <svg width="100%" heig...

0
0
发表了博客
2018/07/03 15:24

SVG之文本

一、文本标签<text>   SVG支持直接对文本进行操作,如果我们需要在SVG中使用文本,那么我们需要使用到<text>标签。直接看一个简单的demo。 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>textDemo</title> 6 </head> 7 <body> 8 <svg id="svg" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="1000"> 9 <defs> 10 <pa...

0
0
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
暂无内容
0 评论
9 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部