大熊的博客

应该说，移动端的开发是伴随着HTML5的兴起而出现的，2007年第一款iPhone诞生，2009年HTML5这个名词第一次登上“舞台”。当时的移动互联网开始逐渐兴起，发展到今，移动互联网已经和人们的日常生活密切相关。作为开发者，对于一个崭新的事物，一直在尝试的“路上”，到底最好的开发方式是什么？本文介绍了从移动端诞生到现在，自己探索到的开发方法，并配以相应知识点，欢迎跟大家沟通、分享。初次

在WEB开发中，时常会用到javascript来获取当前页面的url网址信息，在这里是我的一些获取url信息的小总结。下面我们举例一个URL，然后获得它的各个组成部分：http://i.cnblogs.com/EditPosts.aspx?opt=11、window.location.href(设置或获取整个 URL 为字符串)var test = window.location.href;ale...

iPhoneX 取消了物理按键，改成底部小黑条，这一改动导致网页出现了比较尴尬的屏幕适配问题。对于网页而言，顶部（刘海部位）的适配问题浏览器已经做了处理，所以我们只需要关注底部与小黑条的适配问题即可（即常见的吸底导航、返回顶部等各种相对底部 fixed 定位的元素）。笔者通过查阅了一些官方文档，以及结合实际项目中的一些处理经验，整理了一套简单的适配方案分享给大家，希望对大家有所帮助，以下是处理前后...

在WEB开发中，时常会用到javascript来获取当前页面的url网址信息，在这里是我的一些获取url信息的小总结。下面我们举例一个URL，然后获得它的各个组成部分：http://i.cnblogs.com/EditPosts.aspx?opt=11、window.location.href(设置或获取整个 URL 为字符串)var test = window.location.href;ale...

这是官方的例子https://cn.vuejs.org/v2/examp...这是根据你的数据在官方基础上修改的https://jsfiddle.net/ycloud/b...点击预览scriptvar vm = new Vue({ el: '#app', data: { search: '', products: [{ name: '苹果', pr...

1.<script src="http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js" charset="GB2312" ></script><script type=text/javascript> alert("你的IP是：" + remote_ip_info.province); if(re..

　记得以前做网站时，曾经需要实现一个图片上传到服务器前，先预览的功能。当时用html的<input type="file"/>标签一直实现不了，最后舍弃了这个标签，使用了其他方式来实现了这个功能。　　今天无意发现了一个知识点，用html的file标签就能实现图片上传前预览，感觉很棒，记录一下！就是通过file标签和js的FileReader接口，把选择的图片文件调用readAsData...

1、去除input类型为file上传文件时默认样式和默认”选择文件”等； 2、压缩要上传的图片 3、隐藏上传按钮, 手动触发实现思路隐藏选择图片的input, 点击显示图片触发input的onchange事件// xxx.html<img id="pic" src="./images/xxx.png"><form id="uploadForm" action...

一、页面要求1）  统一使用标准的页头和页尾2）统一使用gb2312编码格式3）页面显示宽度400px-800px，高度一般控制在一屏以内。4）页面不向出现js代码及flash内容（如需要动画全用gif）5）页面所有图片必须为绝对地址6）页面的内容最好以文字的形式来呈现。二、代码要求1）使用table而已来制作页面，且必须设置宽度，而div格式由于有些属性不被邮件客...

需要在本页面中展示vue组件中的超链接，地址栏不改变的方法:<template> <div class="accept-container"> <div class="go-back" v-show="goBackState" @click="goBack">GoBack</div>&

在做移动端页面时，有时你设置了字体大小，有的部分即使设置了行内样式也不生效，而有些显示正常，这个特性就是Text Autosizer在搞鬼。以下是解决方案：①给元素设置 -webkit-text-size-adjust: none;可禁用Text Autosizer，这个属性还能使得我们在移动端使用小于12px的字体。此属性在桌面版中无效。②设置最大高度 max-heigh

Touch1.touchstart：当手指触碰屏幕时候发生。不管当前有多少只手指。2.touchmove：当手指在屏幕上滑动时连续触发。通常我们再滑屏页面，会调用event的preventDefault()可以阻止默认情况的发生：阻止页面滚动。3.touchend：当手指离开屏幕时触发。4.touchcancel：系统停止跟踪触摸时候会触发。例如在触摸过程中突然页面alert()一

这篇文章主要介绍了Html5+JS实现手机摇一摇功能,本文使用HTML5的DeviceOrientation实现监听手机方向传感器数据,实现摇一摇功能雏形,需要的朋友可以参考下HTML5一个重要特性就是DeviceOrientation，它将底层的方向传感器和运动传感器进行了高级封装，提供了DOM事件的支持。这个特性包括两种事件：1、 deviceOrientation：封装了

介绍之前做两个声明：以下代码可以直接运行，当然你别忘了引用jQuery才行。复制代码代码如下:// DeviceOrientation将底层的方向传感器和运动传感器进行了高级封装，提供了DOM事件的支持。// 这个特性包括两个事件：// 1、deviceOrientation：封装了方向传感器数据的事件，可以获取手机静止状态下的方向数据（手机

JQuery 对 Select option 的操作下拉框："selectID" >        "1">1        "2">2        "3">3        "4">4        "5">5        "6">6       下面是对下拉框的基本操作： "javascript

最近很想做一个像美团上点击分类或地址，后面的背景变黑，下拉菜单提亮的效果。如下图其实做个蒙版很容易拉，这是css的写法。 .mban{position:fixed;z-index:16;top:0;left:0;width:100%;height:100%;background:#000;filter:alpha(opacity=50);-moz-opacity:0.5;opacity

H5本地存储有两个API，一个是Web Storage，还有一个是Web SQL。不管是哪一个，都是基于JavaScript语言来使用，接下来我就教你怎么使用H5本地存储，本文篇幅较大，JS代码较多，请耐心阅读。一、Web Storage教程1、概述：对于Web Storage来说，实际上是Cookies存储的进化版。如果了解Co

javascript时间戳和日期字符串相互转换// 获取当前时间戳(以s为单位)var timestamp = Date.parse(new Date());timestamp = timestamp / 1000;//当前时间戳为：1403149534console.log("当前时间戳为：" + timestamp);// 获取某个时间格式的时间

原文：A Visual Guide to CSS3 Flexbox PropertiesFlex布局官方称为CSS Flexble Box布局模型是CSS3为了提高元素在容器中的对齐、方向、顺序，甚至它们是动态的或者不确定大小的新布局模型。Flex容器的主要特征是能够调整其子元素在不同的屏幕大小中能够用最适合的方法填充合适的空间 。很多的设计师和开发者发现Flex布局很容易

input在标签内设置禁止输入空格，通过正则匹配解决问题此处涉及\s:匹配任意空白符 \S:匹配任意非空白字符<input type="text" onkeyup="this.value=this.value.replace(/\s+/g,'')">...