芒果小站

  1. 全球最具业界良心的主机 - DigitalOcean

    毫无疑问,目前做得最好的主机供应商

    猛击这里查看

  2. 芒果小站目前使用的主机 - DigitalOcean

    客服响应快,随时退款,XEN 架构稳定

    猛击这里查看

  3. 最好的日本东京线路主机 - DigitalOcean

    可选弗里蒙特、达拉斯、亚特兰大、纽瓦克、伦敦、东京机房

    猛击这里查看

  • 1
  • 2
  • 3
切换到精简模式
2

使用 JavaScript 和 CSS Rotation 的纯 HTML 时钟

作者 芒果/分类 代码/发布于 2010-02-24 19:46

这里介绍两款 使用 JavaScript 和 CSS Rotation 的纯 HTML 时钟。没有使用任何 Adobe Flash 文件或者 <canvas> 标签,仅仅使用平常的 <div> 和 <img> 标签。其工作方式为把图片置于带有 {overflow:hidden} 属性样式的 <div> 并将其旋转。通过 JavaScript,使用推荐的 CSS 变换属性。

然而,这份代码不兼容 Internet Explorer 或现有的许多旧版本浏览器。它只能在支持 CSS 变换属性的 Google Chrome,Safari 和 Firefox 3.5+ 浏览器下正常工作。

必备条件:支持 CSS 变换属性的浏览器
演示地址:http://joncom.be/code/css-clocks/

英文原稿:Pure HTML Clocks using Javascript & CSS Rotation | WebAppers
翻译整理:使用 JavaScript 和 CSS Rotation 的纯 HTML 时钟 | 芒果

版权所有,转载请注明出处。
转载自 <a href="http://mangguo.org/pure-html-clocks-using-javascript-css-rotation/" title="使用 JavaScript 和 CSS Rotation 的纯 HTML 时钟" rel="bookmark">使用 JavaScript 和 CSS Rotation 的纯 HTML 时钟 | 芒果小站</a>
如果喜欢这篇文章,欢迎订阅芒果小站以获得最新内容。

已经有 2 条群众意见

  1. /2010-03-11 17:22

    很赞! 回应

    #1
  2. ?
    使用 JavaScript 和 CSS Rotation 的纯 HTML 时钟 | zend实验室-java/php学习教程、web前端设计、网站建设、网页设计、网络SEO推广 /2011-07-08 08:03

    […] 转载至:使用 JavaScript 和 CSS Rotation 的纯 HTML 时钟 | 芒果小站 分类: html, 其它 标签: 临时 CSS 左右两栏自适应布局详解 CSS 的优先权基于 YUI 2.8 的层染色褪色效果打造自己的 Reset.css兼容不同浏览器的 CSS Hack 写法利用 iframe 假装异步提交表单PHP 动态输出 X-UA-Compatible 参数CSS 边框重叠鼠标悬停效果神奇的 CSS 元素透明法JavaScript 中的对象引用机制 评论 (0) Trackbacks (0) 发表评论 Trackback […] 回应

    #2

下面我简单说几句