Web前端
文章平均质量分 65
Lankecms
这个作者很懒,什么都没留下…
展开
-
谷歌自动翻译-谷歌翻译api怎样能打开网页默认自动翻译
问题描述谷歌翻译api怎样能打开网页默认自动翻译<br>function googleTranslateElementInit() {<br>new google.translate.TranslateElement({<br>pageLanguage: 'en',<br>includedLanguages: 'en,zh-CN,de...转载 2020-03-07 14:58:13 · 1285 阅读 · 0 评论 -
ul内容自适应居中
在开发过程中,想到一个问题,平时对块级元素居中的时候都是定义一个宽度然后简单的通过margin:0 auto;实现,但是如果内容增加,是不是每次都需要修改宽度呢。我觉得需要思考一个自适应内容,并居中的方案。 于是,我写了一个Demo去思索一下这个问题,并简单检验一下自己的想法。HTML代码如下:1 <div class='container'>2 <u...转载 2019-05-13 16:29:36 · 643 阅读 · 0 评论 -
JavaScript 年度调查报告:React、Vue 和 Angular 三分天下,谁将在 2018 年独占鳌头?
关键时刻,第一时间送达!要论 2017 年最主流的三个 Web 前端框架,应莫过于 Angular、Vue 和 React 了。然而在实际应用中,这三个框架却不尽相同,对于规模不大的前端项目来说,Vue 因其极易上手会被列出首选之位,Angular 在快速开发大型 Web 项目上很受推崇,但仍存诸多缺陷,React 正为 JavaScript 应用开发者提供新的开发方式。因此,面对各有千秋...转载 2018-08-07 14:55:08 · 468 阅读 · 0 评论 -
图解 React
原文出处: Linton Ye 译文出处:郑丰彧 系列博客: 用通俗的语言和涂鸦来解释 React 术语图解 React (本文) 图解 React Native 组件、Props 和 State (待翻译) 深入理解 Props 和 State (待翻译) React Native vs. Cordova、PhoneGap、Ionic,等等 (待翻译)在Reac...转载 2018-08-07 14:39:02 · 301 阅读 · 0 评论 -
kindeditor编辑区空格被隐藏,导致所见所得不一致的解决办法
1.修改kindereditor-all.js中的 var re = /(\s*)<(\/)?([\w\-:]+)((?:\s+|(?:\s+[\w\-:]+)|(?:\s+[\w\-:]+=[^\s"'<>]+)|(?:\s+[\w\-:"]+="[^"]*")|(?:\s+[\w\-:"]+='[^']*'))*)(\/)?>(\s*)/g;为:var re...转载 2018-07-26 14:39:58 · 1114 阅读 · 0 评论 -
JavaScript获取当前url根目录(路径)
主要用到Location 对象,包含有关当前 URL 的信息,是 Window 对象的一个部分,可通过 window.location 属性来访问。方法一、js获取项目根路径的方法?123456function getRootPath(){ var curPageUrl = window.document.location.href; var rootPath = curPageUrl.spl...转载 2018-04-01 14:07:27 · 3608 阅读 · 0 评论 -
css消除a标签点击后的虚线框
当聚焦a标签的时候,在a标签的区域周围会有一个虚线的框,这个虚线框不同于border的是,它是不占有任何宽度的。当你取消焦点的时候,这个虚线框就会自然消失。你可以通过Firefox或者IE等几个版本看到。而Safari、Opera、Google浏览器等本身就不支持这个效果,所以看不到。 这个就是a标签被聚焦后出现了虚线框,也就是outline。 取消a标签点击后的虚线框方法:1:在a标签...转载 2018-03-23 14:32:48 · 1093 阅读 · 0 评论 -
用javascript实现图片等比例缩放
js部分:$(window).load(function() { ImageAutoResize('div[id=demotu]'); function ImageAutoResize(findstr) { var maxWidth = $(findstr).css("width").replace('px',''); var转载 2017-04-22 14:45:17 · 2406 阅读 · 0 评论 -
HTML5 Video开放式标签根据不同浏览器播放不同格式
通过Html5的Video标签语法,我们可以快速的在网页中嵌入影片。但不同浏览器,所支持的HTML5影片格式(视频解码)皆不同,因此除了要备备相关的影音文件外,再来就是要如何让浏览器能自动判断播放的格式,若我们打开的是IE浏览器或Fireofx,它会自动抓取浏览器所支持的格式文件。本以为这需要通过js、或者浏览器特有的属性来作判断,其实一点也不用,直接通过Html5的开放式标签,就会自动依照不同浏转载 2017-03-12 22:18:32 · 1497 阅读 · 0 评论 -
javascript中style属性
解决办法:1、先定义一个CSS规则,然后this.className=''2、document.getElementByIdx_x("a").style.cssText="border-collapse:collapse;border-spacing:1;border:1 solid #0B2565;background-color:white;color:black;text-align转载 2016-11-09 22:24:13 · 1953 阅读 · 0 评论 -
功能强大的HTML5上传组件-Web Uploader
今天向大家介绍一个由百度WebFE团队开发的支持HTML5&Flash的上传组件,组件功能强大而实用,特别是上传体验方面,做很好,支持文件多选,类型过滤,拖拽(文件&文件夹),截图工具图片直接粘贴等功能。兼容性方面也很不错,比如上传组件有HTML5和FLASH支持,用户无需关心内部用了什么内核,并兼容IE6+、iOS 6+、Android 4+。演示 & 下载转载 2016-07-28 13:38:58 · 1050 阅读 · 0 评论 -
基于HTML5的多张图片上传
图片上传之前也有写过demo,不过是单张上传的,最近有个业务需求是需要多张上传的,于是乎从新改写了一下HTML结构:1234class="container"> 请选择一个图像文件: <input type="file" id="file_input" multiple/>转载 2016-07-28 13:36:21 · 864 阅读 · 0 评论 -
KindEditor编辑器关闭过滤html,js,css标题方法
<script>KindEditor.ready(function(K) {var editor1 = K.create('textarea[name="contents"]', {cssPath : '/kindeditor/plugins/code/prettify.css',uploadJson : '/kindeditor/upload_json.php',fileM...转载 2016-07-06 22:09:40 · 3656 阅读 · 0 评论 -
高性能滚动 scroll 及页面渲染优化
最近在研究页面渲染及web动画的性能问题,以及拜读 《CSS SECRET》 (CSS揭秘)这本大作。本文主要想谈谈页面优化之 滚动优化 。主要内容包括了为何需要优化滚动事件,滚动与页面渲染的关系,节流与防抖,pointer-events:none 优化滚动。因为本文涉及了很多很多基础,是我自己学习记录的一个过程,如果上面列出的知识点都了然于胸了,就可以不必往下看了。滚动优转载 2016-05-24 22:11:05 · 1359 阅读 · 0 评论 -
JavaScript 空白与换行
JavaScript 空白大多数情况下,JavaScript 忽略空白或者 JavaScript 语句之间的空格(也包括 Tab 键产生的空白缩进)。通常使用空白或 Tab 缩进只是为了 JavaScript 程序更具可读性,如下例所示:function getAge(){ var age; age = document.getElementById("age_i转载 2015-10-14 14:25:02 · 1311 阅读 · 0 评论 -
jQuery中hover与mouseover与mouseenter的区别
以前一直以为在jquery中其实mouseover和mouseout两个事件等于hover事件。但这两个并不能等同。在wrapper上加事件,当鼠标移动到wrapper上的时候让class="point"的层放大。但如果用mouseover和 mouseout事件的话,当鼠标移动到wrapper层后,point层会变大,但当鼠标在img和text层之间进行移转载 2015-10-17 16:01:15 · 7073 阅读 · 0 评论