169it -->


 
当前位置:  Web服务器/前端>html5

HTML5 sprite 样式创建工具Stitches介绍

 
分享到:
    发布时间:2014-11-18  


     HTML5 sprite 样式创建工具Stitches介绍(本文由www.169it.com搜集整理) Stitches is An HTML5 sprite sheet generator。Stitches 是一个 HTML5 sprite 样式创建工具,可以将多个图片合并成一个,并给出 sprite 样式。Stitches一款HTML5版...

    HTML5 sprite 样式创建工具Stitches介绍(本文由www.169it.com搜集整理)

    Stitches is An HTML5 sprite sheet generator。Stitches 是一个 HTML5 sprite 样式创建工具,可以将多个图片合并成一个,并给出 sprite 样式。Stitches一款HTML5版网页生成器。你只需简单拖放图片文件至页面空白处并点击 “Generate” 即可创建出一款简单的样式列表。Stitches使用一组HTML5 API,它是目前唯一一款兼容Chrome和Firefox最新版本的应用,暂不支持IE9。对于老版本的浏览器,需要安装jQuery 1.7.1+、Modernizr、Dropfile、Flashcanvas。该产品基于MIT许可证发行。

HTML5 sprite 样式创建工具Stitches主页:  Stitches主页

Stitches其它介绍

Implementation

After dependencies, Stitches requires a stylesheet, a script, and an HTML element to get the job done:

<link rel="stylesheet" href="css/stitches-1.3.5.min.css">
<script data-main="js/stitches.js" src="js/stitches-1.3.5.min.js"></script>
The sprite sheet generator is automatically created in elements that have the stitches class:
<div class="stitches"></div>
If you choose, any images that are a part of the initial markup will be loaded onto the canvas:
<div class="stitches">
    <img src="img/test/github.png" data-name="github"/>
    <img src="img/test/gmail.png" data-name="gmail"/>
    <img src="img/test/linkedin.png" data-name="linkedin"/>
    <img src="img/test/stackoverflow.png" data-name="stackoverflow"/>
    <img src="img/test/tumblr.png" data-name="tumblr"/>
    <img src="img/test/twitter.png" data-name="twitter"/>
</div>

依赖(Dependencies)

jQuery 1.7.1, Modernizr 2.0.6, Bootstrap 2.3.0 New

<link rel="stylesheet" href="libs/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="libs/bootstrap/css/bootstrap-responsive.min.css">
<script src="libs/jquery/jquery-1.7.1.min.js"></script>
<script src="libs/modernizr/modernizr-2.0.6.min.js"></script>
<script src="libs/bootstrap/js/bootstrap.min.js"></script>


本类别最新文章推荐:


站内导航:


特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

©2012-2017,169IT.COM,E-mail:www_169it_com#163.com(请将#改为@)

浙ICP备11055608号


-->