input多图上传并即时显示的代码
以下代码经过Firefox、Chrome浏览器测试没有问题，其余浏览器未作测试。 HTML代码： <div id="billList"> </div> <div class="uploadBtn"> <div class="btn"> <p>点击上传</p> <p>票据凭证</p> </div> <input type="file" id="bill" multiple="multiple" accept="....
type="file"的input上传图片实时显示javascript代码
javascript函数代码： function showPreview(source) { var file = source.files[0]; if(window.FileReader) { var fr = new FileReader(); console.log(fr); var portrait = document.getElementById('avatar'); fr.onloadend = function(e) { portrait.src = e.target.result; }; fr.r...
判断滚动到指定位置的javascript代码
经常会用到，判断浏览器窗口是否滚动到指定id的区域。 javascript代码： function isScrolledIntoView(el) { var elemTop = el.getBoundingClientRect().top; var elemBottom = el.getBoundingClientRect().bottom; var isVisible = (elemTop >= 0) && (elemBottom <= window.innerHeight); return isVisible...
关闭当前浏览器选项卡javascript代码
Firefox火狐浏览器默认情况下，windows.close()对于非window.open的页面无效，需要windows.close()生效需要修改浏览器的配置，即在firefox浏览器的地址栏输入:about:config然后找到dom.allow_scripts_to_close_windows;把false改为true，但是这对于网站来说，不可能去修改用户的浏览器设置的，因此还是要通过前端代码解决。 既然Firefox浏览器不支持window.close()，但是可以通过打开新空白选项卡about:blank的方式实现关闭当前选项卡，虽然不是真正意义上的关闭当前窗口...
新浪微博、QQ空间、QQ好友、微信分享javascript代码
点击分享至微信、空间、QQ和微信的javascript代码。 HTML代码部分： <ul> <li class="wb"> <a href="javascript:void(0);" onclick="shareUrl('weibo');">微博</a> </li> <li class="qz"> <a href="javascript:void(0);" onclick="shareUrl('qzone');">QQ空间</a> </li> <li ...
通过js获取当前页面url的信息
在web前端制作中，可以通过javascript获取当前网页url的相关信息，整理如下： 1、设置或获取对象指定的文件名或路径 window.location.pathname 2、设置或获取整个URL为字符串 window.location.href 3、设置或获取与URL关联的端口号 window.location.port 4、设置或获取URL的协议部分 window.location.protocol 5、设置或获取href属性中在井号“#”后面的分段 window.location.hash 6、...
删除手机UC浏览器强制插入关键词链接的方法
以下方法基于jQuery，使用前要先引用jquery库文件。 函数代码： function CaoNiMaDeUc(){ $("a").each(function(index, element) { try{ var thishref=$(this).attr("href"); var thisText=$(this).html(); if(thishref.indexOf("uc.cn")>=0){ $(this).replaceWith(thisText); } } catch(e){ ...
Canvas百分比动画进度条
HTML代码： <ul id="canvas"> <li> <canvas class="canvas" width="900" height="900"></canvas> <span>70%</span> </li> <li> <canvas class="canvas" width="900" height="900"></canvas> &...
CSS3 Flexbox布局快速入门教程
Flexbox 是是 CSS3 引入的新的布局模式，全称是 flexible box （意思是“灵活的盒子容器”）。它决定了元素如何在页面上排列，使它们能在不同的屏幕尺寸和设备下可预测地展现出来。 它之所以被称为 Flexbox ，是因为它能够扩展和收缩 flex 容器内的元素，以最大限度地填充可用空间。与以前布局方式（如 table 布局和浮动元素内嵌块元素）相比，Flexbox 是一个更强大的方式： 在不同方向排列元素 重新排列元素的显示顺序 更改元素的对齐方式 动态地将元...
阿里云免费SSL证书申请以及NGINX服务器配置证书详细教程
HTTPS是网站发展的趋势，因为HTTP协议是不加密传输数据的，安全性低。另外在SEO方面，百度发公告声明已全面支持 HTTPS 网页的收录，使用 HTTPS 的网页被认为更安全，所以在排名上会被优先。另外百度推荐使用域名301重定向把网站的HTTP地址重定向到HTTPS 。 申请证书步骤： 登录：阿里云控制台，产品与服务，证书服务，购买证书。 购买：证书类型选择 免费型DV SSL，然后完成购买。 补全：在 我的证书 控制台，找到购买的证书，在操作栏里选择 补全。填写证书相关信息。 域名验证：可以选择...
老牌滚动时间轴jQuery插件Timelinr
jquery.timelinr.js是一款老牌时间轴插件，可以制作水平和垂直时间轴效果，并且可以进行自动播放。你可以通过参数来控制每次时间轴切换的动画效果。 引用js文件： <script src="js/jquery-1.x.x.min.js"></script> <script src="js/jquery.timelinr-0.9.x.js"></script> HTML结构： <div id="timeline"> <ul id="dates"> &...
memcache 端口11211 未授权访问漏洞修复
memcache是一套常用的key-value缓存系统，由于它本身没有权限控制模块，所以开放在外网的memcache服务很容易被攻击者扫描发现，通过命令交互可直接读取memcache中的敏感信息。因memcache无权限控制功能，所以该漏洞修复方法通过用户对访问来源进行限制解决。 修复方法一： 如果memcache没有在外网开放的必要，可在memcached启动的时候指定绑定的ip地址为 127.0.0.1。例如： memcached -d -m 1024 -u root -l 127.0.0.1 -p 11211 -c 1024 -P /tmp/memc...