最近在做css动画，遇到需要用脚本重新播放动画的情况。例如： css动画代码 代码如下: .seed_txt_out .seed_txt h2 { animation-name: seed-h2; animation-duration: 2s; animation-timing-function: ease; animation-delay: 0s; animation-iteration-count: 1; animation-direction: alternate; animation-play-state: running; position: relative; top: 10px; } @keyframes seed-h2 { from {top: -120px;} to {top: 10px;} } j...
幻灯片自动播放图片是当前网站比较流行的一个展示方式。在网上我们能找到各种特效丰富的幻灯片插件和代码。这里项目需要，我自己做了一个简单的，就不详细讲解了，代码很简单。直接看效果图和代码吧。 所有代码 ppt.html，需要提供相应图片才能显示： 代码如下: PPT Demo .ppt-container, .ppt-container ul, .ppt-container li, .ppt-container img { margin : 0; padding : 0; border : 0; } .ppt-container { width : 7...
代码如下: $(function(){ //这里参考了以下两个站点的介绍 //http://www.w3school.com.cn/html/html_audio.asp //http://www.zhanxin.info/development/2013-05-17-html5-audio.html if($.browser.msie && $.browser.version=='8.0'){ //本来这里用的是,结果IE8不播放声音,于是换成了embed $('#newMessageDIV').html(''); }else{ //IE9+,Firefox,Chrome均支持 $('#newMessageDIV').html('+ 'type="audio/wav"/>'); } }); JavaS...
最近写了一个在线视频播放的功能，感觉这个插件还可以，和大家分享一下！ 代码如下://播放视频 $('#play-product').click(function(){var flvUrl = $(this).attr('data-flv');var Close = 'closePlayer';var box = 'playerBox';var objclose = "#"+Close;var objBox = "#"+box;$("body").append("点击关闭");$(objclose).click(function(){$(objBox).remove();});return false;});JavaScript教程/参考手册 JavaScript热...
一、prettyPhoto简介prettyPhoto是一款基于jquery的轻量级的lightbox图片播放浏览插件，它不仅支持图片，还同时支持视频、flash、YouTube、iframe和ajax。而且prettyPhoto配置和使用都十分简单，扩展性也不错，你可以最大限度地自定义prettyPhoto。目前，prettyPhoto兼容大部分主流的浏览器，包括令人纠结的IE6。 prettyPhoto插件的项目地址：http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/ 建...
本文实例讲述了jquery控制背景音乐开关与自动播放提示音的方法。分享给大家供大家参考。具体如下： 很多人初学网页制作时在网页中加入一段背景音乐，听到音乐响起的那一刻往往都会有一丝的成就感。 这里就为大家讲解如何使用js控制背景音乐播放与停止。具体如下： 一、jquery控制背景音乐开关代码如下://加载背景音乐，并自动播放$('#bg_music').append('');$('#bg_music_btn').click(function(){var state = $('#bg_music_btn').a...
特效介绍 仿门户网站首页泰山压顶式可关闭及重复播放的从上面“压”下来的广告flash+jQuery代码，广告播放的时候，会将整个页面都压下去(这要求您把html部分代码放到您网站最顶部，的下面)，气势恢宏。 演示图使用方法 1、在head引入css。 2、建议，在您网站最顶部放入下面的代码，这样，广告播放，会把您页面的所有内容压下去，气势恢宏：3、flash地址，尺寸和显示时间在qpxl.js文件里面修改。 下载地址 演示地址 以上所述就是本...
本文实例讲述了jquery实现简单的自动播放幻灯片效果。分享给大家供大家参考。具体实现方法如下： html部分：Pretty cool eh? This slide is proof the content can be anything.CSS部分：/* Slides need to be absolutely positioned within the wrapper. This has a tiny bit of extra pizazz: */ #slideshow {margin: 50px auto;position: relative;width: 240px;height: 240px;padding: 10px;box-shadow: 0 0 20px rgba(0,0,0,0...
看下面的效果图很不错吧，是怎么实现的呢？下面小编给大家分享下我的一番宝物，Lisa唱的 在angel beats的插曲。用到html5、css、jquery实现此音乐播放器。 一番宝物，Lisa唱的 在angel beats的插曲最后在简述这个东西怎么写之前，本人男，24岁，籍贯上海，诚招女友一枚，要求：性格温顺。。。（省略500字）一番の宝物Lisa(Yui final ver) 分享切歌html部分就这样略过了。。。。基本都会写。。。.MusicPlayProcess.rotate{anima...
本文实例讲述了jQuery实现自动切换播放的经典滑动门效果。分享给大家供大家参考。具体如下： 这是一个滑动门代码，从外观上看，简洁经典，似乎与平时见到的滑动门没什么区别，不过它有一个重要的功能与众不同，那就是会自动切换【播放】滑动门的内容，像腾讯QQ登录后弹出的每日要闻一样，如果你再加以美化，那么就更完美无暇了。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-auto-cha-tab-style-co...
本文实例讲述了jquery点击缩略图切换视频播放特效。分享给大家供大家参考。具体如下： jquery点击缩略图切换视频播放是一款非常实用的播放代码，点击视频缩略图切换优酷视频播放的视频播放选项卡代码，支持flash视频切换选项卡。 运行效果图： -------------------查看效果 下载源码-------------------小提示：浏览器中如果不能正常运行，可以尝试切换浏览模式。 为大家分享的jquery点击缩略图切换视频播放特效代码如下jquer...
一个动态展示图片的页面：功能：定时从后台取数据，进行页面图片追加。对已经在页面中的图片，进行放大缩小动画展示。目前我们用于微信新关注用户头像展示。<html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <title>抽奖</title> <script src="../../js/jquery-1.7.2.min.js"></script> <style> body{ backgroun...
本文实例讲述了jQuery插件JWPlayer视频播放器用法。分享给大家供大家参考，具体如下： JWPlayer 插件播放视频播放器 使用方法： <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ page contentType="text/html; charset=UTF-8"%> <!DOCTYPE html> <html> <head><meta charset="UTF-8"><meta content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no" name="viewport"/><meta co...
jQuery HTML5 视频播放控制核心代码： <video class="pause" controls poster="images/vedio.jpg" width="663" height="373"><source src="video/Defone3.8_1.mp4" type="video/mp4">您的浏览器不支持html5！ </video> <script type="text/javascript">$(video).click(function() {if ($(this).hasClass(pause) ) {$("video").trigger("play");$(this).removeClass(pause);$(this).addClass(play);} else {$("video").trigger("pa...
先给大家看下效果图，感兴趣的朋友可以参考实现代码核心代码如下所示： $.ajax({ url: "/music/music.txt", type: "get", success: function(data) { data = jQuery.parseJSON(data); var length = data.length; var now=0; for (i = 0; i < length; i++) { $("#musicText li").eq(i).after("<li>" + data[i].text + "</li>") } var player = { playButton: $(".play"), songText: $(".musicText"), state: 0, //0播放，1暂停 audi...