今天做了一个类似于手机端京东首页的页面,效果图如下: 刷新页面的时候,标题栏(也就是搜索栏),背景是透明的,当我们往下滑的时候,可以改变标题栏的背景透明度(渐变效果): 当标题栏滑过轮播图后,透明度就会渐变成1了. 下面是另外做的一个小demo来展示实现这个效果,同时这里也涉及到滚动条的问题哦! 因为脱离项目写这个demo的时候,发现写$('.content1').scroll(function () { 代码... });的时候,没有运行里面的代码. 后来换成$('body').scroll(

之前用VUE写完一个聊天界面,对于ios的效果该优化的地方都已经优化,且已上线.现在因项目需要,在另外一个angularjs+ionic的框架也要写一个聊天页面,目前还在开发中,发现忘记了一些很关键的东西,所以先备个份: 1.当屏幕发生高度变化(其实是当软键盘打开的时候,窗口的高度发生了变化) window.onresize = () =>{ //只要窗口高度发生变化,就会进入这里面,在这里就可以写,回到聊天最底部的逻辑 } 2.vue的写法,把上面的方法写在了mounted里面,然后retur

this.supportOrientation = typeof window.orientation === 'number'; // 检查屏幕方向 checkScreenOrientation() { if (this.supportOrientation) { if (window.orientation === 0) { this.screenOrientation = 'portrait'; } if (window.orientation === 90 || window.orien

移动设备的屏幕有两个方向: landscape(横屏)和portrait(竖屏),在某些情况下需要获取设备的屏幕方向和监听屏幕方向的变化,因此可以使用Javascript提供的 MediaQueryList 对象接口,使用方法如下: 获取当前屏幕方向(是否是竖屏状态) var mql = window.matchMedia("(orientation: portrait)"); 打印mql,得到MediaQueryList对象如下: 可以通过访问对象的 matches 属性来查看查询结

方法一. $(function(){ pushHistory(); window.addEventListener(“popstate”, function(e) { window.location = 返回的地址 }, false); function pushHistory() { var state = { title: “title”, url: “#” }; window.history.pushState(state, “title”, “#”); } }); 方法二.JS监听手机的

要点:占位符 js,监听屏幕滚动事件,当滚动条距离浏览器顶部的距离 大于 要固定定位开始以下元素的距离,则给要固定元素添加fixed样式. 初始化方法时,要给占位符添加样式 function sortNavInit() { $(".consultBox").find(".sort-clone").css("height", $(".conditionList").outerHeight(false)); // .conditi

js监听input等表单输入框的变化事件oninput,手机页面开发中使用到文本框textarea输入字符监听文本框变化计算还可以输入多少字符,如果使用onkeyup的话是无法监听到输入法输入的文本变化的,复制粘贴也不能监听到,于是就用到了oninput事件来监听文本框value值的改变.由于是手机端页面没有考虑IE 这货.过去一般都使用onchange/onkeyup/onkeypress/onkeydown实现,但是这存在着一些不好的用户体验.比如onchange事件只在键盘或者鼠标操作改变

在做视频播放器的时候,遇到一个问题,在用户播放视频然后锁屏之后,视频播放器仍然在继续播放,遇到类似手机系统状态改变的问题的时候,首先想到了广播,下面做个总结: public class ScreenListener { private Context mContext; private ScreenBroadcastReceiver mScreenReceiver; private ScreenStateListener mScreenStateListener; public ScreenLi

在做一个程序的时候,需要时刻保持某一服务是启动的,因此想到了通过监听屏幕SCREEN_ON和SCREEN_OFF这两个action.奇怪的是,这两个action只能通过代码的形式注册,才能被监听到,使用AndroidManifest.xml 完全监听不到.查了一下,发现这是PowerManager那边在发这个广播的时候,做了限制,限制只能有register到代码中的receiver才能接收. private void registerScreenActionReceiver(){ final I

js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊,为了在以后的工作中写出最优化的代码,我们必须要不断的充电,不断的提高自己的技能. 废话不多说,现在我将最近看的有关arry的一些心德和使用分享出来,希望能够给大家带来小小的一点帮助.谢谢! 可以这样说Arry应该是我们在平时写js代码中,使用频率最高的,在平时的项目中,很多数据都是可以通过arry

JS监听整个页面的回车事件 <script type="text/javascript"> document.onkeydown=keyDownSearch;        function keyDownSearch(e) {          // 兼容FF和IE和Opera          var theEvent = e || window.event;          var code = theEvent.keyCode || theEvent.which

原 JS监听回车事件 发表于2年前(2014-06-04 10:16)   阅读(6101) | 评论(0) 11人收藏此文章, 我要收藏 赞0 1月16日厦门 OSC 源创会火热报名中,奖品多多哦   JS监听某个输入框 ? 1 2 3 4 5 6 7 //回车事件绑定     $('#search_input').bind('keyup', function(event) {         if (event.keyCode == "13") {             //回车

在做一个程序的时候,需要时刻保持某一服务是启动的,因此想到了通过监听屏幕SCREEN_ON和SCREEN_OFF这两个action.奇怪的是,这两个action只能通过代码的形式注册,才能被监听到,使用AndroidManifest.xml 完全监听不到.查了一下,发现这是PowerManager那边在发这个广播的时候,做了限制,限制只能有register到代码中的receiver才能接收. 代码如下: public class ScreenListener { private Context

js监听输入框值的即时变化onpropertychange.oninput 很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感. // //   要达到的效果 很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感.比如即时显示输入框已经被输入的字节数,或者即时读取输入的值来进行搜索引导,也就是google的关联搜索效果等. 只要我们能捕获即时事件就能做到很多事情. 需要了解的知识 首先,我们需要了解onchange和o

js监听用户的键盘敲击事件,兼容各大主流浏览器 <script type="text/javascript"> document.onkeydown = function (event) { var e = event || window.event || arguments.callee.caller.arguments[0]; if (e && e.keyCode == 27) { // 按 Esc //要做的事情 alert(1); } if (e &

有些时候,我们需要在网页上,增加一些快捷按键,方便用户使用一些常用的操作,比如:保存,撤销,复制.粘贴等等. 下面简单梳理一下思路: 我们所熟悉的按键有这么集中类型: 单独的按键操作,如:delete.up.down等 两位组合建,如:ctrl(cmd)+ 其他按键,alt+其他按键,shift+其他按键 三位组合键,如:ctrl(cmd)+ shift + 其他按键,Ctrl(cmd)+ alt + 其他按键 大概只有这么几种情况了,至少我没有见过其他的情况.如果确实存在的话,基本实现的原理也

开发后台服务的时候经常需要对屏幕状态进行判断,如果是想要监听屏幕解锁事件,可以在配置里面注册action为 android.intent.action.USER_PRESENT的广播,则可以监听解锁事件.但有时候,在后台执行某个操作时,需要主动判断屏幕的状态,比如是否是亮着的,可以使用PowerManager的isScreenOn方法进行判断,比如屏幕是否开启了自动旋转等. 注册监听解锁广播: 1 2 3 4 5 <receiver android:name="com.home.tests

传送门: 柏链项目学院 使用web3.js监听以太坊智能合约event   当我们在前端页面调用合约时发现有些数据不会立即返回,这时还需要再调用更新数据的函数.那么这样的方法使用起来非常不便,监听event就可以很好的解决这样的问题,下面我们来看看如何监听event.以下内容基于web3.js1.0版本,版本不同可能会代码差异. 1. 修改geth启动参数 全部参数如下 geth --datadir ./data --networkid 15 --port 30303 --rpc --rpcad

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>demo</title> <style> body[zoom='scale']:before{ content: '您的网页处于缩放状态,请按 Ctrl+0 恢复到浏览器默认大小'; z-index: 9999; position: fixed; left:0; top:0; width

使用Node.JS监听文件夹改变有许多应用场合,比如: 构建自动编绎工具 当源文件改变时,自动运行build过程,比如当你写CoffeeScript文件或SASS CSS文件时,保存之后可即时生成对应的JS或CSS. 构建自动布署工具通过侦听源文件夹的改变,你可以自动即时将改后的文件布署到测试服务器,加快你的开发测试速度. 这些工具其实都需要侦听文件夹的改变,基于Node.JS的侦听文件夹改变的模块有很多. fs.watch 其中Node.JS的文件系统也可侦听某个目录的改变, 如fs.watc

js监听浏览器tab窗口切换 ——IT唐伯虎 摘要:js监听浏览器tab窗口切换. if (document.hidden !== undefined) {  document.addEventListener('visibilitychange', () => {    console.debug(document.hidden)  })} // 用document.visibilityState也行 其中, visibilitychange是h5的一个事件(IE9不支持),可以通过这个事件来