(function() { var canvas = document.getElementById('quakeCanvas'); // Create our Planetary.js planet and set some initial values; // we use several custom plugins, defined at the bottom of the file var planet = planetaryjs.planet(); planet.loadPlugin(autocenter({extraHeight: -120})); planet.loadPlugin(autoscale({extraHeight: -120})); planet.loadPlugin(planetaryjs.plugins.earth({ topojson: { file: 'https://101.43.39.125/HexoFiles/js/planetaryjs/world-110m.json' }, oceans: { fill: '#001320' }, land: { fill: '#06304e' }, borders: { stroke: '#001320' } })); planet.loadPlugin(planetaryjs.plugins.pings()); planet.loadPlugin(planetaryjs.plugins.zoom({ scaleExtent: [50, 5000] })); planet.loadPlugin(planetaryjs.plugins.drag({ onDragStart: function() { this.plugins.autorotate.pause(); }, onDragEnd: function() { this.plugins.autorotate.resume(); } })); planet.loadPlugin(autorotate(5)); planet.projection.rotate([100, -10, 0]); planet.draw(canvas); // Plugin to resize the canvas to fill the window and to // automatically center the planet when the window size changes function autocenter(options) { options = options || {}; var needsCentering = false; var globe = null; var resize = function() { var width = window.outerWidth /2 + (options.extraWidth || 0); var height = window.outerHeight/2 + (options.extraHeight || 0); globe.canvas.width = width; globe.canvas.height = height; globe.projection.translate([width / 2, height / 2]); }; return function(planet) { globe = planet; planet.onInit(function() { needsCentering = true; d3.select(window).on('resize', function() { needsCentering = true; }); }); planet.onDraw(function() { if (needsCentering) { resize(); needsCentering = false; } }); }; }; // Plugin to automatically scale the planet's projection based // on the window size when the planet is initia
-多年互联网运维工作经验,曾负责过大规模集群架构自动化运维管理工作。 -擅长Web集群架构与自动化运维,曾负责国内某大型金融公司运维工作。 -devops项目经理兼DBA。 -开发过一套自动化运维平台(功能如下): 1)整合了各个公有云API,自主创建云主机。 2)ELK自动化收集日志功能。 3)Saltstack自动化运维统一配置管理工具。 4)Git、Jenkins自动化代码上线及自动化测试平台。 5)堡垒机,连接Linux、Windows平台及日志审计。 6)SQL执行及审批流程。 7)慢查询日志分析web界面。
本次实验将使用Django 3.0 配合 dwebsocket websocket组件,实现一个网页版的SSH命令行工具,其支持 vim , 支持 ping等交互命令,唯一的一个小缺点是略卡,不知道是我电脑问题还是这个socket框架不稳定呢。
现在的效果可能有点不太好看,因为是看了很多代码雨的 js 代码,明白了大概如何实现之后依葫芦画瓢做出来的,待未来优化。
webqq 中 自适应宽度的JS代码 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script><script src="http://web.qstatic.com/jsapi/alloy.api.js"></script><script type="text/javascript"> try { alloy.onReady(function(){
区别:html方法会识别html标签,text方法会那内容直接当成字符串,并不会识别html标签。
浏览器在开始运行一个页面的时候,首先它会初始化js功能,当js发挥它的功能时候,记录了一系列浏览器按照顺序做的事情,也就是一个执行顺序,谁在谁之前发生,谁在谁之后发生。
可以使用另一个技巧来获取更多一点的页面实际使用面积,那就是去除IOS设备上的地址栏,可以使用页面加载完之后稍稍滚动页面的招术来实现。
https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html
element jQuery JS $(elem).width() border-box: elem.offsetWidth - padding - border content-box: elem.offsetWidth - padding $(elem).innerWidth() elem.clientWidth + scrollbar $(elem).outerWidth() elem.offsetWidth window jQuery JS $(window).width() document.d
概述:本节讲述的内容为当浏览器大小发生变化或者地图展示区域的大小发生变化时,地图的自适应调整。地图的自适应常见于以下几种情况:1、系统中有收缩或者全屏的按钮;2、按F12,进入调试状态。
js页面跳转大全 所谓的js页面跳转就是利用javesrcipt对打开的页面ULR进行跳转,如我们打开的是A页面,通过javsrcipt脚本就会跳转到B页面。 目前很多垃圾站经常用js跳转将正常页面跳转到广告页面,当然也有一些网站为了追求吸引人的视觉效果,把一些栏目链接做成js链接,但这是一个比较严重的蜘蛛陷阱,无论是SEO人员还是网站设计人员应当尽力避免。 常用的JS页面跳转代码调用大全-马海祥博客 很多站长在制作网站的时候,为了某种展示或SEO优化的目的,常常需要利用js跳转效果,所以对于一个站长或SE
/// /// 一些常用的Js调用 /// public class JScript { /// /// 弹出JavaScript小窗口 /// /// <param name="js">窗口信息</param> public static void Extjs(string message) {
注意 注释 的“抓取文件404报错”,“抓取js常规报错”,“抓取页面性能时间”,代码很好理解,将整个操作放在闭包内执行,以免污染外面。 这段代码必须放在head标签头部内,若头部有js外联,那该段代码必须放在js外联之上,若将这段代码放置在http://www.xxx.com/logservice.js,那代码如下:
自定义 React Hook 是一个必要的工具,它可以让你为 React 应用程序添加特殊的、独特的功能。
使用立即执行函数而不是直接暴露也做到来私有化private的意思,比如有5个函数,我只想暴露1个函数给别人,那么window.js1 = {你想暴露的1个函数},这样别人就只能访问你暴露的唯一函数,另外4个访问不了。
1.x:兼容ie678,但相对其它版本文件较大,官方只做BUG维护,功能不再新增,最终版本:1.12.4 (2016年5月20日).
Three.js 是基于 WebGL 技术,用于浏览器中开发 3D 交互场景的 JS 引擎。
一款将消除玩法和动物营救玩法完美结合的休闲游戏,各种场景画面做得十分精致,各种鸟叫声的运用,让音乐充满乡村园林气息,游戏中会有不同颜色的砖块。
当我们需要固定场景背景,固定摄像机的时候。移动旋转物体可以使用Three.js提供的OrbitControls.js,也可以手动写控制器。
这类就没有定义外部的样式css文件,之间在页面中head->style标签中写入:
甚至还会用一下chrome的toggle工具,来查看自己网站在不同屏幕分辨率下是否存在bug
学无止境,我们现在的技术都是基于前一代人之上做出来的,要想成为一个高级/资深的前端,重点不是你能创造多少东西,而是你知道多少东西。有没有解决问题的能力。遇到问题能不能找到最优解,为公司减少成本的同时提升效率。系统性的解决问题,提高代码的维护性、稳定性、可扩展行等等。所以现代社会是一个认知的社会,只有不断的突破自己的认知,才能够成为更优秀的人。
WXSS (WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式。
先通过返回的布尔值判断会否是 iPhone X ,然后再进行操作:比如给头部一个上边距,一般是44px。
好处就是,可以把数据存放到后端数据库里,实现动态添加删除图标,调用的时候只需后端程序按格式输出json数组到前台就行。
原文: https://threejs.org/examples/?q=obj#webgl_loader_obj_mtl 代码: <!DOCTYPE html> <html lang="en"> <
Xterm是一个基于X Window System的终端仿真器(Terminal Emulator)。Xterm最初由MIT开发,它允许用户在X Window环境下运行文本终端程序。Xterm提供了一个图形界面终端,使用户能够在图形桌面环境中运行命令行程序。而xterm.js是一个用于在浏览器中实现终端仿真的JavaScript库。它允许在Web页面中创建交互式的终端界面,用户可以在浏览器中运行命令行程序,执行命令,并与终端进行交互。
上篇文章:https://blog.csdn.net/qq_23853743/article/details/108034430
Ajax序列化实现简单命令工具: 我们通过定制Django,配合命令行执行功能可以实现远程命令执行页面.
bootstrap3-dialog是一款第三方提示框插件,但是使用过程中感觉对打开新的远程页面不太友好,而打开表单嵌套在原页面中又显得代码非常臃肿,所以对bootstrap3-dialog进行二次封装,将新页面嵌套进dialog,形成全局统一的打开页面方式。
可以将代码内容保存到空间里并命名为china-lantern.js然后使用代码调用它,该代码可以放在头部或尾部文件里
上班期间也没时间去更新博客,元旦休假的时候就写点内容,分享一段 WordPress 博客网站下雪特效,喜欢的话也可以拿到你的网站去使用。 <script type="text/javascript"> /* 控制下雪 */ function snowFall(snow) { /* 可配置属性 */ snow = snow || {}; this.maxFlake = snow.maxFlake || 200; /* 最多片数 */
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <script src="../jquery-1.11.0.min.js"></script> <link href="../css/bootstrap.min.css" rel="stylesheet" /> <link href
上一节介绍了canvas的基础用法,了解了游戏开发所要用到的API。这篇文章开始,我将介绍怎么运用这些API来完成各种各样的游戏效果。这个过程更重要的是参透一些游戏开发的思路和想法,而不是仅仅知道怎么写代码来完成这个游戏。 先用一张图来了解一下整个游戏的构成。 Map表示整个背景地图,作用很简单,就是渲染黑色背景。 Player 表示玩家粒子,它尾巴中带有生命点,我们用Life类来表示。 Enemy为红色的敌人粒子,因为技能粒子和Enemy粒子具有很多共性,所以Skill粒子继承自Enemy粒子。 粒子之间
在three.js中,展示的一切内容都是在canvas中绘制的,所以点击事件点击到物体上是无法获取点击对象的,要获取点击的对象要使用RayCaster,用于在三维空间中进行鼠标拾取,原理是:相机与鼠标所在的设备坐标之间的连线经过哪些物体。
作者:Tolonger 原文链接:https://www.jianshu.com/p/9e7e755ca281 除了百分比流式布局之外,rem布局占据了目前移动端布局的热潮。那么究竟这几种布局差别在哪里,对应的有什么效果,希望本文能给你一些有益的启示。除此之外还有响应式布局,固定宽度布局等。 百分比流式布局 这里面最知名的当属bootstrap框架的思路,他所有的组件以及模板ui均是百分比流式布局,单位为px.并且我们看到的大部分对移动端适配的页面也均是采用这种核心思想去做的,方法简单,多端共用,可以针对
page.viewportSize = { width: 1024, height: 600 };
最近在使用码云的giteepages功能在码云上放了几个网页,在实现基本的展现之后,此时博主在想怎么可以再不调用后端接口的方式进行安全验证呢,为了将白嫖进行到底,还真有一个小方法,一起来看看吧。
默认情况下 webpack 会将所有引入的模块都打包到一个文件中例如 JS 最终都会打包成一个 bundle.js, 这样就导致了打包后的文件比较大, 以及修改文件后用户又需要重新下载所有打包内容问题,例如: 在 a.js 中引入了 b.js, 那么 a.js 和 b.js 都会被打包到 bundle.js 中,如果 a.js 有 1MB, b.js 也有 1MB, 那么打包之后的文件就有 2MB,那么用户第一次打开网页的时候就需要下载 2MB 的文件,问题的关键在于, 如果我们修改了 a.js, 但没有修改 b.js,重新打包后用户需要重新下载新打包的文件(因为用户本地缓存的是 a 和 b 的合体文件)这样就导致了每次修改了其中一个文件用户都要重新下载所有内容。
document.defaultView.getComputedStyle(element[,pseudo-element]);
在three.js中,展示的一切内容都是在canvas中绘制的,所以点击事件点击到物体上是无法获取点击对象的,要获取点击的对象,要使用RayCaster,是用于在三维空间中进行鼠标拾取,原理是相机与鼠标所在的设备坐标之间的连线经过哪些物体。
GoogleAdsense 是著名的拖慢加载速度的 JS。一年前的 GoogleAdsense 的 js 获取是链接美国,谷歌嘛,连不上也是正常的,现在基本解析都是上海和北京的谷翔,速度还行,但是加载广告的速度依旧难以忍受。
js操作页面三步骤 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>操作页面的三步骤</title> </head> <body> 操作页面的三步骤 box h1 </body> <script> // 1、获取页面标签 // 2、设置操作的激活条件 - 事件 // 3、具
是不是觉得不可思议,js已经强大到这个地步? 是的,js日新月异,它在不断的进步。只要稍不留神,那我们都只能望尘莫及了。
一、部署JS代码(将以下代码保存为js文件,文件名:love.js,然后直接引入使用,点击页面任意位置就可以看到效果了)
原Js文件,使用方式将下面代码,作为js文件,上传到自己网站,然后在Wordpress的footer引入一下,即科获得左键爱心特效。
早上跟彧繎博主聊天,看到他博客有一篇优化谷歌联盟js优化的文章,因为谷歌在国内尴尬的局面,在网页加载js的时候可能会比较拖拉,然后他又给我了一篇关于优化谷歌联盟js的文章,然后看了下自己网站的加载速度,果然谷歌js加载的速度真的很慢,加速最慢的已经达到了6.19s,另外两个十秒+应该是图片资源,可以暂时忽略。虽说我的网站打开速度不是很快,但是不能这么拖拉啊,是该整顿整顿啦,网站还有百度联盟的广告,但是速度不至于这么拖拉,而且百度的也该下架了,基本没有什么收益,广告太局限了,这一点来说真的不如谷歌,如图,看看吧,就是着速度,嗖嗖地。。。
说在正文之前:封装的FastDialog-Vue适用于页面级Vue开发,即采用引入Vue.js来进行html页面开发
geogebra 动态图可以在网页中显示数学公式,本文记录显示多个geogebra的方法。 实现原理 需要在 hexo 中可以嵌入 geogebra 图像 在 script 语句中建立多个 GGBApplet 对象 在 window.onload 函数中调用多个函数 实现方法 引入 js 文件 本地文件 <script src="/vvd_js/deployggb.js"></script> //路径指向自己建立的js文件 官网文件 <script src="https://cdn.geogebr
领取专属 10元无门槛券
手把手带您无忧上云