shl999-优快云博客

原创百度分享的微信二维码位置处理

var baiduShare = { ele: { weixinEle: $(".article-content .bds_weixin") }, init: function () { baiduShare.ele.weixinEle.bind("click", baiduShare.clickFun)

2017-04-12 16:05:19 3922

原创 placeholder的颜色兼容写法

input:-moz-placeholder, input:-ms-input-placeholder, input::-moz-placeholder, input::-webkit-input-placeholder textarea:-moz-placeholder, textarea:-ms-input-placeholder, textarea::-moz-placehol

2017-04-06 12:00:52 626

原创 owl.carousel轮播插件实例化一次

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>模块</title>  <link rel="style

2017-04-05 10:10:25 4870

原创移动端自适应问题

(function (doc, win) { var docEl = doc.documentElement, resizeEvt = ‘orientationchange’ in window ? ‘orientationchange’ : ‘resize’, recalc = function () { var client

2017-03-31 16:17:31 426

原创 fullpage使用js增加动画

jQuery(document).ready(function ($) { $('.fullpager').fullpage({ //实例化完执行的回调函数 afterRender: function () { $(".fullpage:first-child").find(".animated").ea

2017-03-30 17:13:47 3027 1

原创 js 判断变量是否存在

if (typeof bianliang != "undefined") { //变量存在}if (typeof bianliang == "undefined") { //变量不存在}

2017-03-23 10:27:22 2087

原创元素水平垂直居中

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>垂直居中示例</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="ht

2017-03-17 18:11:50 352

原创图片错误处理函数，基于joomla

2017-03-13 09:31:58 336

原创会话框的三角写法

<div class="a"></div><style>.a{position:relative;}.a::before{condent="";display:block;width:15px;height:15px;border-top:1px solid #ccc;border-left:1px solid #ccc;transform:rotate(-45deg);p

2017-02-19 10:28:55 295

原创刮一刮插件

优惠券刮一刮插件1.利用h5 canvas http://www.helloweba.com/view-blog-270.html 2.jquery.scratchie.js http://www.codefans.net/jscss/code/4593.shtml 引用了google的API，jquery版本1.4.4以上 3.wScratchPad 可以改变画笔大小，这个的图片是

2017-02-16 11:57:00 533

原创动画

写着玩<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>text</title></head><style> body, html { background-color: #171717; } .box2 { width: 200

2017-02-14 15:36:22 310

原创使用锚链接实现首页面的全屏滚动

要使用jquery.min.js 和jquery.mousewheel.js 这两个插件。具体html如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>使用锚链接实现首页面的全屏滚动</title> <style> *{ padding: 0; margin:

2017-02-09 10:19:15 355

原创 sass循环 each、for

@each $headericon in item-120, item-121, item-122, item-123, item-124, item-125 { &.#{$headericon} > a { background-image: url('#{$imagespath}/header/#{$headericon}.png'); }

2017-02-06 17:21:39 1538

原创一些插件

https://github.com/farhadi/html5sortable github2.http://jsfiddle.net/neochief/KWeMM/3.http://jsfiddle.net/hQnWG/4.http://jsfiddle.net/T68Fn/1.Sortable jqueryuiAngularJS http://www.qttc.net/20141145

2017-02-06 17:19:50 225

原创两个元素垂直居中

.val { font-size: 16px; display: inline-block; vertical-align: middle; line-height: normal; text-align: left; } .search-cl

2017-02-05 16:46:04 572

原创 iscroll5 手机滚动插件使用

实例化var myScroll = new IScroll('div', {scrollX: true, scrollY: false, click: true, probeType: 3});//横向滑动myScroll.scrollToElement('.active', true, true)//active自动滚动到中间myScroll.on('scroll', function ()

2017-02-05 16:10:52 724

原创 js的向上取整(Math.ceil)向下取整(Math.floor)四舍五入(Math.round)

2017-02-05 15:31:08 39676

原创 webkit autofill 改变背景颜色

谷歌浏览器的提示框选中，有黄色背景，如何去掉呢？方法一：input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #3c3c41 inset; -webkit-text-fill-colo

2017-01-19 11:39:52 834

原创一个效果

var aboutUs = { ele: { slideEle: $(".about-slide"), slideAEle: $(".about-slide li a"), contentEle: $(".about-content .items") }, init: functi

2017-01-18 14:40:04 282

原创 owl carousel2 幻灯片/轮播插件

官网：http://www.owlgraphic.com/owlcarousel/ Github地址：https://github.com/OwlCarousel2/OwlCarousel2 中文文档：http://www.htmleaf.com/jQuery/Slideshow-Scroller/201502161387.html 在线示例：http://owlcarousel2.githu

2017-01-12 18:19:23 8054

原创 wow.js 向下滚动动画插件使用说明

Wow是一个鼠标向下滚动，内容逐渐显示的插件，它依赖animate.css 动画（或者其他的动画库），功能类似 waypoints 插件。Github地址：https://github.com/matthieua/WOW 使用说明：http://mynameismatthieu.com/WOW/docs.html 在线示例：http://mynameismatthieu.com/WOW/调用：

2017-01-12 15:48:22 2398

原创瀑布流或者动态加载 click点击无效的问题

将 $(".div").click(function(){ });改为： $('body').on('click', '.div', function () {})

2017-01-02 15:44:48 562

转载 jq插件写法

(function ($) { var methods = { init: function (options) { // this }, show: function () { // is }, hide: function () { //

2017-01-02 10:31:30 1713

原创将数组对象变成json字符串

最终结果输出是这种数组，如下图：代码： var jsonData=”“; for(var s in newData){ jsonData+=’”’+s+’”’+”:”+JSON.stringify(newData[s])+”, “; } console.log(jsonData); “

2016-12-25 16:54:27 1287

原创浏览器兼容问题，兼容ie8+，火狐

兼容ie：margin-top:-1px\0; 兼容火狐： @-moz-document url-prefix() { margin-top:-1px; }

2016-12-12 16:44:47 3011

原创滚动监听实现

$.fn.smartFloat = function () { var position = function (element) { var top = element.offset().top,array=[],content=$(".content .items"); for(var i=1;i<content.length+1;

2016-12-01 18:59:34 810

原创 doT.js插件的使用

可以在线测试：http://olado.github.io/doT/index.html Github地址：https://github.com/olado/doT 详细文档：http://www.cnblogs.com/kuikui/p/3505768.html说明：本插件不依赖其他插件。dot.js主要的用途就是，在模板上放进数据，生成含有数据的html代码。 1、it是传递进去的数据对象

2016-11-29 18:57:19 2830

原创在移动端，body:overflow 无效的问题

在手机浏览器上，给body增加overflow:hidden;width:100%;height:100% 无效的问题。在网上找了几种解决办法1、body加position:fixed; —-可行2、给要滚动的元素添加一个父级，设定高度，overflow：auto；3、html,body{height:100%;overflow:hidden}后两种没有实验，不知道可行不可行。

2016-11-28 10:03:34 9796

原创 jq 计算div宽度--innerwidth，outerwidth，width

width()方法用于获得元素宽度； innerWidth()方法用于获得包括内边界（padding）的元素宽度； outerWidth()方法用于获得包括内边界(padding)和边框(border)的元素宽度；如果outerWidth()方法的参数为true则外边界(margin)也会被包括进来，即获得包括外边框(margin)、内边界(padding)和边框(border)的元素宽度。

2016-11-25 17:27:33 3079

原创获取地址栏特定字符后面的字符

var abouturl=location.href;//获取地址 var str_after = abouturl.split("#")[1];//获取后面字符 $("li").each(function () { var a=$(this).children().attr('href'); if(a=='#'+str_after){

2016-11-23 17:59:04 2074

转载 input宽度随文字变化而变化

<input type="text" class="form-control"><script>var searchinput=$("input");var textWidth = function (text) { var sensor = $('<pre>' + text + '</pre>').css({display: 'none'});

2016-11-16 16:57:55 11218

原创 aJax 表单提交代码示例

话不多说，直接上代码：<script> var formEle=jQuery("#message-form");//这里是你的表单id var msgEle=jQuery("#message-tips");//这里是提示消息 formEle.submit(function () { jQuery.ajax({ type:jQuery(t

2016-11-16 15:22:15 347

最近使用这个插件来做下总结。 gethub官网地址：https://github.com/cubiq/iscroll/比较全的中文API：http://www.mamicode.com/info-detail-331827.html一目了然的用法：http://blog.youkuaiyun.com/a41070289/article/details/50877675//实例化滚动插件 var my

2016-11-16 10:28:16 14068

转载 javascript 的数组的sort（）排序。

因为sort()函数使用的是冒泡排序，冒泡排序会重复地走访要排序的数列，一次比较两个元素，如果他们的顺序错误就把他们交换过来，一直重复地进行直到说该数列已经排序完成。如果a-b>0(即正数)就把a和b的位置交换，也就是较小的一个数会排到前面；如果b-a>0就把a和b的位置交换，也就是较大的一个数会排到前面。function sortNumber(a, b){return a - b //

2016-11-15 12:02:32 260

原创搜索框

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css"> <script s

2016-11-11 15:34:33 316

转载序列化表单出现乱码--解决方法

console.log(decodeURIComponent($("#form").serialize()))decodeURIComponent 进行解码

2016-11-11 13:16:16 1042

转载 jq 获取radio的值

使用jquery获取radio的值,最重要的是掌握jquery选择器的使用，在一个表单中我们通常是要获取被选中的那个radio项的值，所以要加checked来筛选，比如有以下的一些radio项：1.jquery获取radio的值 2.jquery获取checkbox的值 3.jquery获取select的值要想获取某个radio的值有以下的几种方法,直接给出代码： 1、1.(‘input[

2016-11-11 09:16:36 538

转载 javascript ,jq 实现input随文字变化而变化

<input name="text" onkeyup="checkLength(this)"/><script language="javascript"> function checkLength(which) { var iCount = which.value.replace(/[^\u0000-\u00ff]/g,"aa").length;

2016-11-10 10:58:52 1101

原创 hover 右侧的 | 隐藏

实现下图所示效果鼠标经过的时候没有右侧的 |。一般的方法是用border-right。可是鼠标经过后一个a链接的时候，border-right还在。后来想的是在a链接下面加span标签，可是实现起来总是不对 a:hover span{display：none} 仅仅是鼠标经过的时候这个a链接下面的span隐藏，当鼠标 hover后一个a链接的时候span 还是在。同border-rig

2016-11-09 16:08:34 475

原创 css 实现蒙版效果

样式：<style> .back {background:url(images/coupon-logo.gif) no-repeat;} .top {height:100px;background-color:#fff;filter:Alpha(Opacity=60);opacity:0.6;}</style>html<div class="back"> <div clas

2016-11-08 10:28:16 48759

空空如也

空空如也