基于野狗实时数据库搭建网页弹幕(下)

boyanx3个月前技术教程14

我们已经了解了野狗数据库的基本的数据操作,接下来我们来了解下我们另一个组Jquery.barrager.js!

Jquery.barrager.js 是一款优雅的网页弹幕插件,支持显示图片,文字以及超链接。支持速度、高度、颜色、数量等自定义。

当然使用它也是非常简单,只需要在GitHub下载源文件然后引入以下两个文件夹即可~

那么,我们前期的所有工作已经准备好了,现在就开始我们激动人心的部分吧!

  1. 首先我们得有一个发送内容的输入框和发送按钮:

    先下我们有了发送按钮,以及文本输入框,接下来就要给这两个绑定时间,获取到你输入的内容,并且保存到野狗数据库room节点下!注意,这里就要用到我们上次说的push操作了哦~

  2. 我们已经发送了,那么我们现在做的就是要从数据库拿到数据,并且显示出来,这里就要用到野狗数据库的实时性了!还记得我上次说到的child_added事件吗?child_added事件作用就是对一个节点数据的监听,只要该节点数据发生变化,比如或者删除或者增加操作,立刻就会发送给客户端!那我们要怎么做呢?

    这里itme是什么呢?itme就是我们每个小小的弹幕条,就是这个小东西

    他有以下属性:

    当然还有bottom,如果不指定,那么bottom是随机产生的~

  3. 好了,完事具备,就差实验了,接下来就是见证奇迹的时刻!

    那么接下来看下我们数据库里面的数据到底有没有存入数据呢?答案是肯定的!

相关文章

前端框架 Vue 不要一开始就用脚手架~Axios 中的GET、POST请求

作为后端攻城狮,写前端代码是一种什么体验?相信不少人和 @Python大星 一样,有写过前端代码的经历。记录一下,Vue 框架开发中“啼笑皆非”的故事,非专业前端人员,该案例无 css 美化,引起不适...

介jquery.validate.js简单实用的表单验证框架

最近在做用户登录、注册、以及用户中心...然后之前在慕课网学的jquery.validate用得着地方了,根据自己需求进行了细节修改,重要是样式方面吧。第一次发表这些,说得不好不要介意,开始吧。首先:...

百度竞价网呼代码:怎么在一个页面里面多处输入回拨功能

最近的百度对于恶意代码查的也严格,行业人都懂得,但是用百度自己的产品都没有关系,早在一年前百度竞价的网呼代码应用的很多地方。今天来说说怎么灵活试用百度的网呼代码,而不是单单后台设置下那种简单的页面,没...

Katalon 所有关键字及其含义

以下为katalon所有关键字及其含义,具体可参考官方文档:序号关键字含义1Accept Alert接受当前弹窗(如确认对话框)。2Authenticate处理 HTTP 基础认证(输入用户名和密码)...

教你把百度的关键字搜索偷过来用用。

话不多说,先上效果图。怎么样,是不是和在用百度一下时,关键字搜索补全一样一样的。今天下午没什么事,打开百度首页的Newwork看了一下,发现我每次输入内容后,它都会把我们输入的内容发送到后台,后台返回...

前端三剑客:HTML、CSS 和 JavaScript

#头条创作挑战赛#一个基本的网站包含很多个网页,每个网页主要是由三部分组成,即结构(HTML)、表 从入门到精通 Python网络爬虫框架Scrapy 12 现(CSS)和行为(JavaScript)...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。