一个页面,多个flash(刚学jq插件)

只贴js那部分哦

调用

// flash轮播图
    var sumF=$(‘.btnTabs span‘).length/4; //有四个flash
    var flashT01=new flash($(‘.flash01‘),sumF);
    var flashT02=new flash($(‘.flash02‘),sumF);
    var flashT03=new flash($(‘.flash03‘),sumF);
    var flashT04=new flash($(‘.flash04‘),sumF);
    flashT01.createF();
    flashT02.createF();
    flashT03.createF();
    flashT04.createF();

详细代码

/**
 *
 * @authors Jerry wong ([email protected])
 * @date    2015-04-16 09:23:42
 * @version $Id$
 */

function flash(ele,num){
    this.num=num;
    this.element=ele;
    this.timer=null;
    this.oIndex=0;

}

flash.prototype={
    createF:function(){
        var _this=this;
        _this.autoP();
        $(_this.element).find(‘.btnNext‘).click(function(){
            _this.nextBtn();
            _this.autoP();
        });
        $(_this.element).find(‘.btnPrev‘).click(function(){
            _this.prevBtn();
            _this.autoP();
        });
        $(_this.element).find(‘.btnTabs span‘).click(function(){
            _this.numClick(this);
            _this.autoP();
        });
    },
    nextBtn:function(){
        this.oIndex++;
        if (this.oIndex>=this.num) {
            this.oIndex=0;
        };
        $(this.element).find(‘.adImg‘).eq(this.oIndex).fadeIn().siblings(‘.adImg‘).fadeOut();
        $(this.element).find(‘.btnTabs‘).children(‘span‘).eq(this.oIndex).addClass(‘selected‘).siblings().removeClass(‘selected‘);
    },
    prevBtn:function(){
        this.oIndex--;
        if (this.oIndex<0) {
            this.oIndex=this.num-1;
        };
        $(this.element).find(‘.adImg‘).eq(this.oIndex).fadeIn().siblings(‘.adImg‘).fadeOut();
        $(this.element).find(‘.btnTabs‘).children(‘span‘).eq(this.oIndex).addClass(‘selected‘).siblings().removeClass(‘selected‘);
    },
    numClick:function(ev){
        this.oIndex=$(ev).index();
        $(ev).addClass(‘selected‘).siblings().removeClass(‘selected‘);
        $(ev).parents().siblings(‘ul‘).children(‘.adImg‘).hide().eq(this.oIndex).fadeIn();
    },
    autoP:function(){
        var _this=this;
        clearInterval(_this.timer);
        _this.timer=setInterval(function(){
            _this.oIndex++;
            if (_this.oIndex>_this.num-1) {
                _this.oIndex=0;
            };
            $(_this.element).find(‘.adImg‘).eq(_this.oIndex).fadeIn().siblings(‘.adImg‘).fadeOut();
            $(_this.element).find(‘.btnTabs‘).children(‘span‘).eq(_this.oIndex).addClass(‘selected‘).siblings().removeClass(‘selected‘);
        }, 3000);

    }
}
时间: 2024-10-06 18:02:25

一个页面,多个flash(刚学jq插件)的相关文章

前端页面js与flash交互——js获取flash对象,并传递参数

背景介绍: 最近在搞一个项目,涉及到图片选取,裁剪,上传等,由于浏览器安全性问题,js无法获取到<input type="file">中选取的文件路径,而且对照片的裁剪,抠图等由HTML5实现的功能,对各大浏览器的兼容性,真是不敢太大胆.这个时候就引进了flash,然后所有js做不了的让flash来做,然后由js来控制页面元素.就这样开始了js与as的交互之旅,听做flash的大叔说,flash调js的函数式很好调的,而js调as不大容易.最终的情况是as调js错误层出不穷

JavaScript网站设计实践(七)编写最后一个页面 改进表单

原文:JavaScript网站设计实践(七)编写最后一个页面 改进表单 一.最后一个页面 contact.html.改进表单 在该页面实现的功能: 几乎所有的网站都会有表单填写,对于用户输入和填写的数据,首先我们一般现在前台验证,然后再去后台验证. 在前台最简单的验证:检查必填字段是否填写.填写格式是否符合要求等. 每个表单里面,当获取到输入焦点时,令提示文本消失 现在开始动手来写. 1.实现思路 (1)在这个表单里会验证的是必填字段和邮箱格式是否正确.首先,把判断必填字段和邮箱格式分别写在两个

在页面中插入flash的代码实例

在页面中插入flash的代码实例: 有时候网页中需要插入一个flash,作为一个媒体文件,将其引入当然需要一定的格式,下面就介绍一下如何实现辞此功能,不过建议还是使用工具插入,比如使用DW,它就有专门的可视化工具直接点击按钮插入就可以了. 代码如下: <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="62" height="62" type="a

刚学Android遇到的问题,findViewById值为null(新版本),老鸟欢迎你的指正

环境交代: 刚学Android,在官网下载的新版的ADT 以及新版的SDK 在新版的IDE(ADT)创建项目时如果你的最小版本(minimum required SDK)要支持4.0以下版,并且目标版本为(4.0+).那么此时IDE会为你创建一个兼容包 (appcompat_v7)如下图, 创建发短信项目后就会有如下的项目目录结构 这个时候在生成的项目主Activity不是以前的那种继承的Activity,而是继承的ActionBarActivity,我把发短信的界面创建起.界面效果如下.点此时

如何将一个HTML页面嵌套在另一个页面中

这个在做网页中常要用到,有些通用的内容可集中放在一个页面文件中,其它要用到这些内容的页面只需要包含(引用)这个通用文件即可.这样便于维护,如果有很多网页,当通用内容需要修改时,只改一个文件就可以了,不需要每个文件单独修改. 最典型的应用比如页脚的版权信息等内容可以放在一个叫做footer.html文件里, 然后其他页面文件在页面内容的最后包含这个文件就可以了,具体例子下面有. 要html文件嵌套,最简单的办法是使用SSI(Server Side Include)技术,也就是在服务器端两个文件就被

HTML 页面加载 Flash 插件的几种方法

前言 之所以写这篇文章,主要是因为组长给提的一个新的需求--使用浏览器调用电脑的摄像头,来实现即时拍照的功能.在网上查了很多资料,由于这样那样的原因,最终选择了使用flash插件来调用pc的摄像头.当然,这个需求是基于B/S架构的,因此,就在想怎么把它嵌入到前端的HTML页面中. 题外话 当然,这里还没有考虑到封装,主要是先以实现为目的,后续工作再根据业务进行抽象,封装成通用的组件.好了,废话不多说,看重点. 嵌入插件 使用 object 和 embed 标签 代码展示 <span style=

写一个简单的JQ插件(例子)

虽然现在 vue angular react 当道啊但是那 JQ还是有一席之地很多很多的小单位啊.其实还会用到 我也放一个例子吧虽然我也不是很肯定有没有人写的比我更好啊但是我相信 我这个还是蛮实用的 话不多说 丢代码 JQ插件标准的封装代码如下,首先需要闭包: <scripttype="text/javascript"> (function ($) {  //这里放入插件代码 })(jQuery); </script> 这是jQuery官方的插件开发规范,这样写

从一个页面请求开始(一)

在本地浏览器上输入www.hello.com时,简单的实现流程是:在客户端上,检查本地的hosts文件中是否有主机名和ip对应,有对应ip,则用HTTP协议封装数据请求,添加应用层首部,添加tcp首部,添加ip首部,添加mac地址后从本地出去,到对应的WEB服务器上,没有对应的ip,则查找resolv.conf文件上DNS的位置,DNS不在同一网络内,则请求需要通过网关做转发,通过路由器来寻找到对应DNS的位置,此处可能经过多个DNS解析,直到DNS找到后,将FQDN解析为一个互联网上的ip,再

微信点击图文消息链接 在根据判断跳到另一个页面 但是 点关闭 将当前的关闭之后 会出现空白页

<script> function ss() { var u = navigator.userAgent; if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机location.href = '2.html?id=3323/#wechat_redirect'; } else if (u.indexOf('iPhone') > -1) {//苹果手机location.href = '2.html?id