分享一款基于jQuery在线问卷答题系统代码是一款实用的jQuery答题插件,点击下一题切换带有淡入淡出效果。实现的效果图如下:

在线预览   源码下载

实现的代码。

html代码:

  <div class="demo">
<div id='quiz-container'>
</div>
</div>

js代码:

   var init = { 'questions': [{ 'question': 'jQuery是什么?', 'answers': ['JavaScript库', 'CSS库', 'PHP框架', '以上都不是'], 'correctAnswer': 1 }, { 'question': '找出不同类的一项?', 'answers': ['写字台', '沙发', '电视', '桌布'], 'correctAnswer': 3 }, { 'question': '国土面积最大的国家是:', 'answers': ['美国', '中国', '俄罗斯', '加拿大'], 'correctAnswer': 3 }, { 'question': '月亮距离地球多远?', 'answers': ['18万公里', '38万公里', '100万公里', '180万公里'], 'correctAnswer': 2}] };

        $(function () {
$('#quiz-container').jquizzy({
questions: init.questions
});
});

via:http://www.w2bc.com/Article/32596

基于jQuery在线问卷答题系统代码的更多相关文章

  1. 基于jQuery右下角旋转环状菜单代码

    基于jQuery右下角旋转环状菜单代码.这是一款固定在页面的右下角位置,当用户点击了主菜单按钮后,子菜单项会以环状旋转进入页面,并使用animate.css来制作动画效果.效果图如下: 在线预览    ...

  2. 基于jQuery垂直多级导航菜单代码

    基于jQuery垂直多级导航菜单代码是一款黑色风格的jQuery竖直导航菜单特效下载.效果图如下: 在线预览   源码下载 实现的代码. html代码: <ul class="ce&q ...

  3. 基于jQuery图片自适应排列显示代码

    基于jQuery图片自适应排列显示代码.这是一款基于jquery.flex-images插件实现的类似谷歌图片流效果.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div ...

  4. 基于jQuery左右滑动切换图片代码

    分享一款基于jQuery左右滑动切换图片代码.这是一款基于jQuery实现的左右滑动切换焦点图代码.效果图如下: 在线预览   源码下载 实现的代码: <div class="v_ou ...

  5. 基于jquery右侧悬浮加入购物车代码

    分享一款基于jquery右侧悬浮加入购物车代码.这是一款基于jQuery实现的仿天猫右侧悬浮加入购物车菜单代码. 在线预览   源码下载 实现的代码: <!--左侧产品parabola.js控制 ...

  6. 基于jQuery实现文字倾斜显示代码

    这是一款基于jQuery实现文字倾斜显示,这是一款基于jQuery实现的超酷动态文字显示效果.适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗. ...

  7. (转)passwordStrength 基于jquery的密码强度检测代码使用介绍

    使用很简单. 代码如下: $('#pass').passwordStrength();  XHTML 代码如下: <p><label>请输入密码:</label>  ...

  8. 课程设计-基于SSM的在线课程教学系统代码-基于java的线上课程资源共享论坛系统

    注意:该项目只展示部分功能,如需了解,评论区咨询即可. 1.开发环境 开发语言:Java 后台框架:SSM 前端框架:vue 数据库:MySQL 设计模式:MVC 架构:B/S 源码类型: Web 编 ...

  9. jquery css3问卷答题卡翻页动画效果

    这个选项调查的特效以选项卡的形式,每答完一道题目自动切换到下一条,颇具特色.使用jQuery和CSS3,适合HTML5浏览器. 效果展示 http://hovertree.com/texiao/jqu ...

随机推荐

  1. 【laravel5.4】关键字【use】使用

    1.在namespace 和 class 之间使用,是引入类文件的意思,命名空间过长或者类文件同名,可以使用[as]区别 2.在class 类里面使用[use],是导入trait  类的意思,多继承的 ...

  2. POJ----The Suspects

    The Suspects Time Limit: 1000MS   Memory Limit: 20000K Total Submissions: 18890   Accepted: 9150 Des ...

  3. word中批量修改图片大小

    一,在word中按alt+f11组合键,进入VBA模式二,在左边的工程资源管理器中找到你的word文档,在其上右键/添加/模块三,把下面代码复制,粘贴进去.四,更改数值, 改一下宽度和高度数值(10) ...

  4. ASP.NET中UrlEncode应该用Uri.EscapeDataString()

    今天,茄子_2008反馈他博客中的“C++”标签失效.检查了一下代码,生成链接时用的是HttpUtility.UrlEncode(url),从链接地址获取标签时用的是HttpUtility.UrlDe ...

  5. Linux命令-用户管理:useradd,userdel,usermod,id,su,env,exit

    添加一个linux用户之后,相当于在linux系统里面创建了如下文件: 添加一个用户(默认也会创建一个同名的用户组,在linux下面用户默认必须在一个用户组里面): useradd wyp 添加用户w ...

  6. HTML中button和input button的区别

    button和input button的区别 一句话概括主题:<button>具有<input type="button" ... >相同的作用但是在可操控 ...

  7. Android开发之线性布局详解(布局权重)

    布局权重 线性布局支持给个别的子视图设定权重,通过android:layout_weight属性.就一个视图在屏幕上占多大的空间而言,这个属性给其设 定了一个重要的值.一个大的权重值,允许它扩大到填充 ...

  8. Fix-Mapped Addresses

    一.前言 某天,wowo同学突然来了一句:如果要在start_kernel中点LED,ioremap在什么时间点才能调用呢?我想他应该是想通过点LED灯来调试start_kernel之后的初始化的代码 ...

  9. Linux内核(12) - 子系统的初始化之那些入口函数

    内核选项的解析完成之后,各个子系统的初始化即进入第二部分—入口函数的调用.通常USB.PCI这样的子系统都会有一个名为subsys_initcall的入口,如果你选择它们作为研究内核的切入点,那么就请 ...

  10. JDK1.5新特性,语言篇

    Java 1.5版本,就是Java 2 Standard Edition 5,Version 1.5,简称Java 5.版本代号Tiger. 一. 泛型(Generics) C++通过模板技术可以指定 ...