建站教程 - 简单搜索

javascript实时监听获取当前浏览器屏幕大小

2024年09月30日 javascript如何利用window.addEventListener和resize实时监听浏览器获取窗口大小！下面web建站小编给大家详细介绍一下实现代码！代码如下： function getWindowSize(){ // 获取窗口的宽度和高度，不包括滚动条 var w = document.documentElement.clientWidth; var h = document.documentElement.clientHeight; }

js监听页面，浏览器tab切换到当前页面时执行方法

2024年09月30日功能介绍：当浏览器切换到当前页面的时候执行一个方法，当用户离开当前页面的时候执行另一个方法！实现代码如下： document.addEventListener('visibilitychange', () => { if (document.visibilityState == "visible") { console.log('当前页面进入用户视野，执行当前方法！') } else { console.log('当前页面

addEventListener监听浏览器离开（回到）当前页面执行

2024年09月30日浏览器切到其他页面后，有时候会出现定时器不执行，或者定时器错乱等问题，这时候我们就需要监听一下浏览器，在用户回到当前页面的时候重新再执行一下！监听代码如下： document.addEventListener('visibilitychange', function () { if (document.visibilityState == 'hidden') { console.log('离开当前页面触发'); } else

vue项目移动端如何实现上滑加载？

2024年09月30日 vue项目移动端如何利用addEventListener监听和this.$nextTick(() => {}）实现上滑加载功能？下面web建站小编给大家详细介绍一下实现代码！实现代码如下： created(){ loading = showLoading('加载中…')//这是我引用的vant可以不写 this.custid = localStorage.getItem('cust_id') //初始化加载数据 this.methods

js如何设置事件监听

2024年09月29日 js如何设置事件监听，下面web建站小编给大家详细介绍一下实现代码！实现代码如下： window.onload = function(){ var btn = document.getElementById('btn'); btn.addEventListener('click',function(){ console.log('执行监听代码！') },false); }

如何利用js检测用户滚动页面的位置

2024年09月29日如何利用js检测用户滚动页面的位置，下面web建站小编给大家简单介绍一下具体代码！代码如下： window.addEventListener('scroll', function(){ let div = document.querySelectorAll('.div'); let scrollPosition = window.pageYOffset; div.forEach(function(element){ let spe

事件绑定addEventListener和事件解除绑定removeEventListener的基本用法

2024年09月29日事件绑定obj.attachEvent的基本用法 function on(obj, type, fn){ if(obj.addEventListener){ obj.addEventListener(type, fn, false) }else{ obj.attachEvent('on'+type, fn) } } 事件解除绑定obj.detachEvent的基本用法 function on(obj, type,

vuejs移动端实现滚动到底部自动分页

2024年09月29日 1、先创建2个参数，pageNum当前页码，totalCount总页面 data(){ return:{ pageNum: 1, totalCount: 0 } } 2、在created()创建一个滚动scroll监听 // 监听滚动条 window.addEventListener("scroll", () => { //滚动条滚动时，距离顶部的距离 let scrollT

CSS3实现菜单栏横向滑动效果

2024年09月29日移动端想实现菜单栏横向滑动效果，不想用swiper插件或js来实现，这样太废代码了，下面web建站小编教大家如用css3来实现这种效果！ 1、css3代码 .menu {height:36px;margin:8px 0;overflow:hidden;} .menu ul{margin:0;padding: 0; height:60px;white-space:nowrap;overflow-y:hidden;-webkit-overflow-scrolling

el-table列太多导致横向滚动条不在当前屏幕中解决方法

2024年09月29日 1、在el-table中新增:height="tableHd"参数 <el-table :data="listData" border v-loading="dataLoading" ref="table" :height="tableHd"> 2、在data中定义tableHd:0 3、高度赋值 this.$nextTick(() =>

css3解决滚动条太难看问题

2024年09月29日问题描述：页面因内容太多出现一些滚动条，但是系统自动的滚动条太难看，下面web建站小编给大家介绍一下::-webkit-scrollbar的作用。 /*滚动条*/ ::-webkit-scrollbar-track-piece { background-color: #fff; } ::-webkit-scrollbar { width: 13px; height: 13px; } ::-webkit-scrollbar-thumb

关于vue3中JSX的使用方法介绍

2024年09月29日 JSX是JavaScript的一个类似XML的扩展，那么JSX如何在vue3中使用呢？下面web建站小编给大家详细介绍一下！ vue3+vite的项目不支持/code>jsx，如果想支持jsx，需要安装插件。 1、安装jsx脚手架 npm i @vitejs/plugin-vue-jsx -D 2、在vite.config.js中进行配置： import vueJsx from "@vitejs/plugin-vue-jsx"; export defaul

Vue为什么要用JSX？语法介绍

2024年09月29日 Vue为什么要用JSX？下面web建站小编给大家简单介绍一下它的各种写法！一般写法 createElement( 'a-heading', { props: { level: 1 } }, [ createElement('span', 'Hello'), ' world!' ] ) JSX写法 <a-heading :level="1"&g

ios系统内容滚动条卡住怎么解决

2024年09月29日 ios系统内容滚动条卡住怎么解决，下面web建站小编给大家详细介绍一下解决方法！具体解决代码如下： body,html{ -webkit-overflow-scrolling: touch; }

如何利用css怎么隐藏scroll滚动条

2024年09月29日如何利用css怎么隐藏scroll滚动条，下面web建站小编给大家详细介绍一下具体实现代码！具体代码如下： //IE浏览器 -ms-overflow-style: none; /* IE 10+ */ //Firefox浏览器 scrollbar-width: none; /* Firefox */ //Chrome和Safari浏览器 ::-webkit-scrollbar { display: none; }