web前端
麦兜麦兜麦兜兜
我是整理近期问题才会来csdn更新博客,所以导致好多小伙伴私信我的问题,我都是过了好久才看到,sorry啦,有不明白的地方,可以微博找我。
微博:璐飞童鞋。关注之后,私信即可。(手动笔芯)一旦忙起来,微博都不怎么上了。为了方便大家交流,我建了一个微信群,想进群的朋友,请看置顶文章。
展开
-
JqueryMobile传参问题
Jquerymobile在同一页面传参问题原创 2015-10-09 09:21:20 · 290 阅读 · 0 评论 -
IE8加载后台数据失败(location.origin兼容问题)
在本地起了个 sever,用于ajax跟后台交互。写完页面之后,在谷歌,火狐,360相继测试一切正常。但是要求最低兼容IE8,最后就在IE8下进行测试,发现:页面根本没有加载任何后台数据。于是乎,费尽力气在IE下调试JS。奈何,JS真难调。此时,对IE8的愤怒已经到了极点。但是还得找问题。最后发现是因为,正在我JS代码中有这么一段:var basePath="";if (window.locati原创 2016-10-20 14:44:15 · 5010 阅读 · 1 评论 -
数组排序,选出最优选择
话不多说,先讲需求吧。 我们都会遇到这样一个场景:在天猫或者京东中,优惠券的使用,假设你的个人账户有好多优惠券,那么当消费满减的时候,会有一个最优的选择。 举个栗子:你消费50元,现在你有3张优惠券,分别是:满20减5块,满10块减10块,满30减5块。请写出使用优惠券的方案::1(满20减5块,满30减5块==一共减了10块),2(满20减5块,满10块减10块==一共减了15)3.(满20减原创 2017-05-18 15:22:10 · 941 阅读 · 0 评论 -
swiper在IE8下失效
最近在做一个轮播的效果。找到了swiper这个插件。在移动端用着挺好的。但是在PC端的话,IE下效果全部失效。后来了解到,swiper3是专门针对移动端写的。如果想兼容IE8的话,应该引入swiper2. 也就是:idangerous.swiper.js。 另外还有一个Js可以兼容IE8,用着也还不错:jquery.SuperSlide.2.1.1.js。待会上传资源,有需要的可以去下载。 ...原创 2016-09-20 15:32:11 · 20834 阅读 · 0 评论 -
兼容IE8图片轮播
最近在做一个活动,其中产品给的需求是:一共是8张图片,开始显示2张,点击第3张,这时候页面显示3张。中间为大图,两边是小图。好了,直接贴代码了;//轮播JS /*未元素的首尾添加补白*/ var $panels = $('#slider .scrollContainer > li'); var $parent=$panels.parent();//或许当前li的最近一级的父原创 2016-12-19 14:28:21 · 3863 阅读 · 0 评论 -
video.js在IE8下无法正常播放
使用video.js插件在PC端播放视频,官方说可以兼容IE8,但是下载DEMO下来后在本地测试,发现IE 8不能播放。后来搜索资料发现了video.js兼容版本。这个应该是国内的在video.js基础上做了修改。发现特别给力。在这里要特别感谢兼容版本作者。 1. 基本代码结构: 2.现在来看一下Index.html<html><head> <title>Video.js</titl原创 2016-06-16 11:26:32 · 10701 阅读 · 13 评论 -
融云聊天--web SDK API
因为产品需求,需要有聊天功能,客服功能。用的是融云的,他把什么方法都集成好了,用起来很方便。并且是免费的。但是第一次接触,并不是那么顺利,并且在网上搜不到相关核心资料,只能硬着头皮看文档,实在没办法就去融云提交工单。深知做前端第一次接触融云不不易,所以我在这梳理一下融云的相关方法。方便和我一样找不着头绪的前端使用。 1.聊天室的样式(包括消息的气泡)是你自己定义的。融云不提供样式的选择。这样的好处原创 2016-03-03 11:20:50 · 15063 阅读 · 39 评论 -
微信分享缩略图不显示
项目活动页面有个微信分享的功能,在分享出去以后,分享链接缩略图不显示。微信默认的是从body中找取第一个img标签。 但是整个活动页面都是作为背景图片显示的。为了不影响原来页面结构,刚开始是硬生生的添加了img,给他的display设置的none.发现这样设置以后,微信也 找不到了。所以这种 行不通,但是还必须有个img标签。最后解决的方法是:. 感觉 肯定还有别的方法,但是目前就了解这一种。如果原创 2016-06-06 12:50:04 · 6226 阅读 · 2 评论 -
前端如何实现商品规格
最近做了一个商品规格,咱们平时买东西会选择一些譬如:颜色,大小之类的。乍一看,挺简单。但是真正实现起来,突然发现自己对于JS的数组掌握的不是特别好。同时也明白了,学好JS数组很重要,学好JS数组很重要,学好JS数组很重要。这个必须要说三遍。因为我当时学习JS的时候,不知道为何,心里有点排斥它。所以,工作中,它会狠狠的报复你!开个玩笑,不过,数组真的要好好掌握。 这是即将要做的规格:先来说一下实原创 2016-03-17 16:04:46 · 9028 阅读 · 0 评论 -
JQueryMobile+融云webSDK创建的聊天室有多余空白
做了一个视频电商,要求上边放视频,下边有聊天室可以聊天。因为融云提供免费的即时通讯服务,所以用的融云的web SDK .但是有一个问题就是,聊天室我给了样式:#chatRoom{height:10rem;overflow:scroll;} 发送消息的时候,消息内容距离发送框有一大截空白,并且不同的移动设备遗留的空白页有所不同。最后的解决办法就是具体算出我聊天室的高,不能用:10rem.并且一定要有原创 2015-12-18 10:00:26 · 1622 阅读 · 0 评论 -
写了一个HTML页面,想用手机打开怎么办?
写了个HTML页面,想用手机访问怎么办?有三种方式一:xampp服务器(需要电脑一台,手机,xampp服务器) 具体实施步骤:1.到官方下载xampp安装到电脑上2.打开xampp,将写好的H5页面放到XAMPP文件夹中的htdocs文件夹中。3.查看本机的局域网IP地址,如:192.168.1.100,然后手机连接到与PC同一个路由器中(就是将手机的Wlan连接地址换为原创 2015-10-29 14:10:53 · 37255 阅读 · 1 评论 -
移动端下拉刷新
做了一个小的demo,移动端下拉刷新页面数据。没用插件。主要实现思路。大致说一下: 1.首先进入页面要进行ajax请求数据。 2.监视页面产生下拉动作,再次请求数据。 3.奏是这么简单粗暴。 4.上代码:第一步:$.ajax({ url: basePath + '你自己的url', type: 'get', asyn原创 2017-01-06 17:13:26 · 2293 阅读 · 1 评论 -
解决IE8 不支持getDate
第一,先说需求:后台返回一个时间,我需要获取这个时间的后一天时间。再次或许系统时间和后一天时间进行比较,依次做不同业务。 第二,因为要在 后台时间加一天,我用到了getDate()这个方法,IE8不支持, 第三,解决方法:`//兼容IE8 function parseIS(dateStringInRange) { var原创 2017-03-24 11:43:11 · 1385 阅读 · 0 评论 -
css3-animation超级好用的动画小插件
css3小动画,实在是丰富了前端展示页面的效果。虽然IE8不兼容(爱兼容不兼容,奏是这么傲娇)。但是在谷歌,火狐表现都 没差。今天就介绍一个css3动画小插件,分分钟满足你实现各种妖魔化动画效果。 1.需要引入css文件:animate.css 2.引入js文件:wow.min.js 3.找到页面中需要添加动画的元素添加class;比如:wow fadeInRight animated an...原创 2016-12-21 15:04:41 · 3706 阅读 · 3 评论 -
获取url?后的参数
在我们编写页面的时候,两个页面之间互相传参,是很应用很频繁的。抛开安全因素之外。我们一般习惯在进项页面跳转的时候直接添加在跳转地址之后,比如像这样:window.location.href=b.html?investmentmoney="+investmentmoney+"&interestRate="+interestRate;将参数传过去之后,要在B页面接受传来的参数。 好了,注意了,下边介绍原创 2016-09-29 15:44:55 · 1673 阅读 · 0 评论 -
git撤销commit操作
使用git的时间不是很长,所以一旦操作不当就会出现问题。之前遇到问题都是抓瞎,立马跑去问头咋得回事。今天有遇到一个问题。push失败。原因是commit的时候没加说明,正确的是:commit -m “说明”,我直接:commit -m,结果Push失败。后来就想着,将缓存到分支的文件删除,重新再将文件略做修改,重新push. 步骤:git reset –hard HEAD(回退最近一次提交)原创 2016-10-13 11:25:43 · 2002 阅读 · 0 评论 -
无缝隙跑马灯
<div id=""> <ul> <li>11111</li> <li>11111</li> <li>11111</li> <li>11111</li> </ul> </div> <script> $.fn.imgscroll = function(o)原创 2016-09-06 09:55:49 · 436 阅读 · 0 评论 -
APP气泡聊天框
好久没写博客了。今天给大家分享一个气泡聊天框。div.speech { margin: 10px 0; padding: 8px; table-layout: fixed; word-break: break-all; position: relative; background: -webkit-gradient( linear, 50% 0%, 5原创 2015-11-13 15:44:59 · 1056 阅读 · 0 评论 -
用HTML5写的视频,在IOS应应用中可以打开,在安卓应用中打不开。
最近在写一个视频电商,看着挺简单,写起来发现没想象的那么简单。遇到的小问题就是一些样式问题,最大的问题是写好的视频打包后,在安卓应用里无法播放。我一直认为是打包的问题,因为我的页面用手机的浏览器可以播放,打包的说是我的事,经过一番争论,从我这开始找问题,发现原来是因为,安卓不支持HTML5的source src属性。头大的问题没想到是因为这么个小问题。原来是这样写的: <video>原创 2015-12-14 13:17:58 · 2698 阅读 · 1 评论 -
D3.js中文文档
Api参考此文档翻译自 API Reference (英语),版本为 2013-9-9 。不能保证文档的同步更新,因此,需要了解最新的开发特性,请移步英文版 API 参考 。d3 库所提供的所有 API 都在 d3 命名空间下。d3 库使用语义版本命名法(semantic versioning)。 你可以用 d3.version 查看当前的版本信息。d3 (核心部分转载 2016-03-23 10:39:39 · 8989 阅读 · 0 评论 -
JS 数组去重
话不多说,直接贴代码:<script> Array.prototype.numberRepeat=function(){ var numberContent=[this[0]]; for(var i=1;i<this.length;i++){ var repeat=false; for(var j=0;原创 2016-04-06 16:30:24 · 474 阅读 · 0 评论 -
css3 placeholder中含有文字和字符,字符如何在input中垂直居中
有这个一个小功能 星号垂直居中。这是最后要呈现的效果。">```如果只是单纯让这样写,它会是这样的效果:![这里写图片描述](http://img.blog.csdn.net/20160513102416971)这时候只需要加上font-family: sans-serif;“` 然后,就可以了。原创 2016-05-13 10:26:36 · 1949 阅读 · 1 评论 -
页面中插入QQ表情
在页面中插入QQ表情。用的是一款jquery插件:jquery.qqFace.js。 1.页面引入jquery+jquery.qqFace.js两个js文件<script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="jquery.qqFace.js">原创 2016-04-20 17:39:29 · 732 阅读 · 0 评论 -
跨域CORS原理及调用具体示例
我们知道,在前端开发中会遇到跨域问题,一般会使用jsonp解决跨域问题。但是使用jsonp的话,有其自身不足就是只能使用GET提交,若传输的数据量大,这个JSONP方式就歇菜了。那今天就来介绍另一种跨域介绍方案—CORS。相对JSONP,CORS支持POST提交,并且实施起来灰常简单,CORS原理只需要向响应头header中注入Access-Control-Allow-Origin,这样浏览器检测到转载 2016-05-17 14:08:39 · 375 阅读 · 0 评论 -
关于Data的问题汇总
1.后台返回字符串“20160608”需要将后台的时间转换为“2016年06月08号” 实现方法: var str ="20160608"; var ts=str.substring(0,4)+'年'+str.substring(4,6)+'月'+str.substr(6)+'日'; 2.后台返回的时间为:“20160608”,需要与系统时间做对比 实现方法:var Y=new Date(原创 2016-06-08 16:02:37 · 476 阅读 · 0 评论 -
手机APP字体随着屏幕的变化而变化
最近手写移动端样式比较多。其中涉及一个很重要的就是字体的大小。现在移动端分辨率不尽相同,在不同分辨率下显示不同不同字体大小,是做移动开发的基础。实现方法有多种,可以是媒体查询,也可以JS控制。媒体查询的我就不贴了,在这我贴出JS控制字体大小。<script> (function (doc, win) { var docEl = doc.documentEl原创 2016-07-26 11:57:46 · 2312 阅读 · 0 评论 -
Tab页的切换
废话不多少,直接贴代码。<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>活动</title> <meta name="viewport" content="initial-scale=1,原创 2016-07-29 10:11:06 · 344 阅读 · 0 评论 -
JS A页面跳转B页面后,B页面样式全部失效
页面跳转是最平常不过得操作。我比较常用的是loaction.href=”XXX.html”,但是从A页面跳转到B页面之后,B页面的样式全都乱掉了。如果你也遇到了这样的情况,希望从 以下几个方面去排查。 1.看css是否加载了进去。如果确定没有加载进去,可以将 外链的css写到<header></headder>中去,看看是否解决。 2.如果确定css已经完全加载成功,但...原创 2016-08-01 09:27:47 · 3308 阅读 · 3 评论 -
前端小工具
作为前端经常修改页面样式。改来改去都忘到底修改了什么。在这给各位推荐一个小神器:html代码对比工具。说到这,这种工具有好多,今天我只介绍一种,我用着感觉很方便的。 https://www.diffchecker.com 我是一般直接用在线的。 把你想对比的html或者css文件分别粘贴左右两侧。点击find绿色按钮。就可以方便的查看不同在哪里了。原创 2016-09-01 15:04:58 · 434 阅读 · 0 评论 -
跑马灯
<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /></head><body> <div id=roll1 style="OVERFLOW:hidden; WIDTH:450px;"> <table> <tr> <td id="rollleft1">原创 2016-09-04 17:20:24 · 427 阅读 · 0 评论 -
欢迎进行技术交流
方便大家交流,建了一个微信群,以后大家有什么不明白的问题,可以在群里进行沟通。原创 2018-03-28 09:58:11 · 337 阅读 · 2 评论