瓜瓜小博

挣扎的码农

判断页面中的图片是否加载完成

页面加载时判断图片是否完全加载

判断页面中的图片是否加载完成 有时候需要在页面一开始就获取图片的高度进行一些操作，有个问题就是在获取图片高度的时候图片还没有完全加载完成，这样获取的图片高度是0。所以需要在获取图片高度之前判断一下图片是否加载完成。 如果只要监听一张图片，可以使用onload $('img').load(function(){ // 加载完成 }); 如果有很多图片需要一起箭筒的话上面的...

Posted by ddxg on May 13, 2018

在背景图上加一层渐变层

svg

在背景图上加一层渐变层 有时需要在背景图片上结一层渐变的效果，是的背景看起来更加好看。 可以使用两张图片重叠在一起的方式实现，但是感觉有点麻烦。也可以使用background-image 添加两张背景图片。感觉第二种方法比较简洁一些。 背景图中，可以通过background-position 来对多个背景进行定位。 写法如下： background:url("haoroomsCSS1_s...

Posted by ddxg on February 10, 2018

H5开发中遇到的问题

H5开发

H5开发中遇到的问题 1.滑动页面卡顿、慢 有时app中的H5页面滑动起来感觉阻力很大，划得很慢。 可以在滚动的block元素中添加如下样式，滑动就会变得更顺滑，用户体验更好 body { -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } 概述： -webkit-overflow-scrolling ：...

Posted by ddxg on February 4, 2018

React Native 基础知识2

React Native

React Native 基础知识2 1. 父组件向子组件通信、子组件之间通信 父组件以自身的state作为子组件的props；父组件调用setState，于是子组件的props相应变化 通过ref调用子组件的方法 有个例子： import React, { Component } from 'react' import { AppRegistry, StyleSh...

Posted by ddxg on January 14, 2018

React Native 基础知识

React Native

React Native 基础知识 1. React 组件 React 允许将代码封装成组件（component），然后像插入普通 HTML 标签一样，在网页中插入这个组件。 可以使用class定义组件，也可以使用一个函数来定义一个组件，下面使用class来定义一个GoodMorning组件，使用函数定义一个GoodEvening组件。 import React, { Component...

Posted by ddxg on January 14, 2018

jQuery jsonp跨域请求

JSX

jQuery jsonp跨域请求 浏览器的同源策略限制从一个源加载的文档或脚本与来自另一个源的资源进行交互。 1、什么是同源策略 源就是{协议，主机，端口}定义的。只有这些值完全一样才认为两个资源是同源的。 看个例子： 给出一个对比的URL：http://www.example.com/dir/page.html 如果要在js中发起跨域请求，则要进行一些特殊处理了。 解决跨域...

Posted by ddxg on January 7, 2018

React Native -- JSX 语法

JSX

React Native – JSX 语法 字面上来看JSX即 JavaScript XML取首字母结合，所以JSX并不是一门新语言，仅仅是个语法糖。React发明了JSX，React的核心机制之一就是虚拟DOM，可以在内存中创建虚拟DOM元素。React利用虚拟DOM来减少对实际DOM的操作从而提升性能。 利用HTML语法来创建虚拟DOM，JSX语法会通过Babel转换成浏览器认识的JS...

Posted by ddxg on January 1, 2018

:before与:after

css伪类效果

:before与:after :before与:after是css2中的伪类，::before与::after是css3中的伪元素。平时使用伪类比较少，伪类有时候使用还是挺方便的。 1、:before与::before的区别 :befor是Css2的写法，::before是Css3的写法，css3为了区分伪类和伪元素，伪元素采用双冒号写法。 :before的兼容性要比::be...

Posted by ddxg on December 24, 2017

html 文字、图片水平无限滚动

文字、图片滚动

html 文字、图片水平无限滚动 经常在淘宝、京东的app页面中看见水平的广告轮播和中奖信息的轮播。 我知道的实现这种无限滚动效果的方法有三种： 使用CSS3样式实现 使用js实现 marquee标签（好像不推荐使用了，我没用过，百度可以找到挺多相关博客的） 1.方式 不管是用css实现还是js，实现方式是差不多的。为了让无限循环滚动时内容衔接更好一点，滚动内容会有两...

Posted by ddxg on December 16, 2017

js正则表达式

Regular Expression

js正则表达式 平时写代码的时候感觉正则表达式使用地不多，要验证邮箱、手机之类的话，我基本都是百度搜索的。但是，有时要使用特定场景的正则的时候，虽然感觉很简单但我自己又写不出来，百度又搜索不到我想要的正则，这时就感觉挺尴尬的。我这里记一些笔记。 1. 创建正则表达式 字面量方法 var reg = /abc/g; 构造函数 var reg = ...

Posted by ddxg on December 10, 2017

FEATURED TAGS
前端开发 CSS 布局 React Native JavaScript html CSS3 HTML5 vue 框架 kaikeba webpack CSS World
ABOUT ME

挣扎的码农

FRIENDS