dawn888

Html5移动端弹幕动画实现示例代码

摘要：已知20条内容要有弹幕效果，分成三层，速度随机。先来看看效果: 所以这里不考虑填写生成的。只是一个展现的效果。如果要看填写生成的，请不要浪费Time 思路把单个内容编辑好，计算自身宽度，确定初始位置移动的距离是屏幕宽度 js动态的添加css动画函数，将高度、动画移动时间、动画延迟时间都用随机阅读全文

posted @ 2020-04-14 08:00 dawn888 阅读(1142) 评论(0) 推荐(0) 编辑

利用Ajax实现异步请求

摘要： Ajax 1.课程引入静态网站和动态网站都是同步的，但同步方式有缺点：页面请求响应式阻塞，影响用户体验为了解决这个问题，可以通过变通的手段实现页面的局部更新（隐藏帧），由于隐藏帧不方便就有了Ajax 2.隐藏帧实现局部更新 <form action="./11inner.php" method= 阅读全文

posted @ 2020-04-13 08:20 dawn888 阅读(1087) 评论(0) 推荐(0) 编辑

ES6新特性箭头函数和常用function()对比

摘要： // 无参 var fn1 = function() {} var fn1 = () => {} // 单个参数 var fn2 = function(a) {} var fn2 = a => {} // 多个参数 var fn3 = function(a, b) {} var fn3 = (a, 阅读全文

posted @ 2020-04-10 17:53 dawn888 阅读(217) 评论(0) 推荐(0) 编辑

JavaScript实现简单的弹幕效果实例分析

摘要：不知大家有没有感受到，弹幕又是另一出好戏！！不过我个人还是比较排斥看电视的时候被出来的弹幕打扰。今天我们来写一个简单的弹幕。简单到什么程度呢？看下效果：由图可以看出，我们的呆毛html结构确实是非常简单啦。就是由一个p、一个input框另加一个button组成。 <p id="box" cla 阅读全文

posted @ 2020-04-10 16:46 dawn888 阅读(622) 评论(0) 推荐(0) 编辑

从前端到后端实现弹幕的过程（jsp/Jquery.barrager.js）

摘要： Jquery.barrager.js插件，可以去网上下载！下载完后，就把下载文件中的js文件、css文件、图片文件、等等等文件全部拷贝到你们自己的项目中去,千万别拷贝漏了，如果你怕拷贝漏了什么，那就把所有的文件夹都拷贝到你自己的项目中去！先看我们要做成什么样的效果：如下图 barrage.jsp页阅读全文

posted @ 2020-04-10 15:23 dawn888 阅读(1187) 评论(0) 推荐(0) 编辑

解决弹幕之间的碰撞问题

摘要：第一次发博客有点小紧脏。事情开始于一周前，因为公司项目需要做一个弹幕展示的功能。室友给我推荐了一款弹幕 https://yaseng.org/jquery.barrager.js/ 插件。网站代码说的很详细，但是，是基于PHP端后台做的，作为一个PHP文盲，真的很无力，但是还好，大致能了解写的什么。阅读全文

posted @ 2020-04-10 15:20 dawn888 阅读(665) 评论(0) 推荐(0) 编辑

Ajax 简述与基础语法

摘要：目录 Ajax 1. 原生 JS 实现 Ajax 2. 使用 Ajax 实现异步通信 a. Ajax 的基础语法 b. 用 Ajax 传递数据 i. 传递字符串数据 ii. 传递 JSON 数据 3. 异步通信案例：搜索候选栏 a. 主要功能 b. 代码实现 c. 示例文档与效果图 Ajax Aja 阅读全文

posted @ 2020-04-09 12:54 dawn888 阅读(475) 评论(0) 推荐(0) 编辑

jquery 延迟执行方法

摘要： setTimeout方法使用时需注意： //以下两种方式都行： setTimeout(function () { test(); }, 2000); //或者 setTimeout('test()',2000); function test(){ alert("aaaa"); } //以下是错误示例阅读全文

posted @ 2020-04-09 11:54 dawn888 阅读(12802) 评论(0) 推荐(0) 编辑

解决同层hover事件重叠闪烁问题

摘要：完整代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D 阅读全文

posted @ 2020-04-08 12:01 dawn888 阅读(668) 评论(0) 推荐(0) 编辑

解决click与hover(mouseover)的冲突问题

摘要：主要应用到一个知识点：$(selector).data('name','value'); <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title> 阅读全文

posted @ 2020-04-01 17:51 dawn888 阅读(1810) 评论(0) 推荐(0) 编辑