首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

CSS 三模仿android 中的toast效果

2012-08-22 
CSS 3模仿android 中的toast效果在android中,可以使用toast搞出一个信息提示的效果,在CSS 3中,其实也可以

CSS 3模仿android 中的toast效果
在android中,可以使用toast搞出一个信息提示的效果,在CSS 3中,其实也可以
模仿一下,如下代码,先是CSS:

<script type="text/javascript">var intervalCounter = 0;function hideToast(){var alert = document.getElementById("toast");alert.style.opacity = 0;clearInterval(intervalCounter);}function drawToast(message){var alert = document.getElementById("toast");if (alert == null){var toastHTML = '<div id="toast">' + message + '</div>';document.body.insertAdjacentHTML('beforeEnd', toastHTML);}else{alert.style.opacity = .9;}intervalCounter = setInterval("hideToast()", 1000);}function save(){drawToast("Item saved");}</script>  <button onclick="save()">Save</button>


   可惜只能在非IE下运行了

热点排行