通过axisLabel属性设置Echarts横纵坐标轴核度名称的文字样式 Echarts官方文档给出的设置坐标轴名称文字样式的属性是nameTextStyle,但在yAxis标签中配置后并不生效,这是因为把坐标轴的name标签和axisLabel标签混淆了,nameTextStyle属性设置的是坐标轴的名称标签name,而要修改坐标轴核度data[]的文字样式,要使用的是坐标轴刻度标签axisLabel,两者虽然标签有不少相同的属性,但实际设置的东西是不一样的。 坐标轴名称... Web前端开发 / 2023-11-13 / 2020次阅读
Echarts柱状图barGap参数设置柱间距离不生效的问题 series-bar.barGap是series标签的一个参数,用于配置不同系列的柱与柱之间的柱间距离(数值为柱子宽度的百分比)。配置起来很简单的一个参数,但是会发现直接添加到series标签后不生效,原因是没有把grid标签的top、left、bottom、right四个参数设置完,缺少一个都会导致barGap的配置不生效。 不生效的代码: var option = { grid: { left: "... Web前端开发 / 2023-11-13 / 2032次阅读
Echarts给图形上的label标签数值添加单位或其它文本内容 Echarts图形上的文本标签label标签默认只显示数值,如果想显示更多的文本或者调整样式,可以通过配置label标签参数实现。如给图形的数值增加一个单位字符串。 给数值增加其它文本内容要用到的label标签参数是formatter(标签内容格式器),示例如下: 原代码: series: [ { name: 'Direct', type: 'bar', stack: 't... Web前端开发 / 2023-11-13 / 1732次阅读
jquery左右拖拽对比前后效果图片的代码 新旧两张图片效果的不同对比,实现效果通过拖拽按钮对比相同位置的差异。 HTML代码: <div class="compare"> <div class="pic before" style="background-image:url(before.jpg);"></div> <div class="pic after" style="backgro... Web前端开发 / 2023-10-11 / 1027次阅读
javascript判断当前浏览器是否是微信浏览器 判断是否是微信浏览器和判断其它浏览器的方法一样,都可以通过navigator对象的userAgent属性(用户代理,简称 UA)来获取浏览器的标识,然后判断是哪个浏览器。 判断微信浏览器的代码: 便于多次使用,把判断写成函数形式: function is_weixin(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/M... Web前端开发 / 2023-09-08 / 1233次阅读
javascript获取video视频某一帧作为poster封面图片 HTML标签Video的poster属性可以给视频添加一个图片作为视频未开始播放时的封面,但如果不想单独添加图片,也可以通过代码利于canvas获取视频的某一帧作为封面图片。 HTML代码: <video id="cvideo" src="upload/video.mp4" webkit-playsinline="true"... Web前端开发 / 2023-08-09 / 1905次阅读
百度富文本web编辑器UEditor工具栏完整的按钮列表 UEditor编辑器除了默认显示出来的工具名称外,还可以增加更多的常用工具,下面是UEditor编辑器工具栏默认支持的完整的按钮列表,可以参考根据需求添加。 toolbars: [ [ 'anchor', //锚点 'undo', //撤销 'redo', //重做 'bold', //加粗 'indent', //首行缩进... Web前端开发 / 2023-08-07 / 1202次阅读
TweenMax实现网页元素无缝循环跑马灯效果代码记录 炮马灯效果通过基础的js代码或HTML的marquee标签都能实现,如果想学习TweenMax插件不妨通过其跑马灯效果代码入手会比较容易理解。 1、下载插件:http://www.tweenmax.com.cn/source/ 把压缩后文件夹里的src/minified/TweenMax.min.js和src/minified/plugins/ModifiersPlugin.min.js文件... Web前端开发 / 2023-07-18 / 1606次阅读
Javascript监控页面指定DOM所有图片是否加载完成的代码 实现监控检测网页所有图片是否加载完成的思路:把网页所有img定义成一个数组变量,再实例化一个Image对象,然后遍历前面的数组变量,把每个src逐个附值给Image对象src,再逐个通过onload事件判断图片是否加载完成。 扩展:ready是指DOM结构加载完成后执行,不包括网页上的图片等媒体元素;onload则是DOM结构和页面资源(图片、视频、flash等)全部加载完成后执行。所以判断图片是否加载完成要用onlo... Web前端开发 / 2023-06-09 / 1758次阅读
jQuery自定义向右滑动显示隐藏效果的方法slideLeft(),slideRight() 向下滑动显示slideDown()和向上滑动隐藏slideUp()是jquery内置的常用方法,现在再自定义增加一组向右滑动显示slideRight()和向左滑动隐藏的方法slideLeft(),其实也是一个简单的jquery插件。 代码如下: jQuery.fn.slideLeft = function( speed, callback ) { this.animate({... Web前端开发 / 2023-05-30 / 2218次阅读
JavaScript判断指定数字是否是小数的方法代码 js没有直接判断一个数字是不是小数的方法,但可以通过indexOf()方法来获取小数点的位置,通过返回值来判断是否是小数;或者通过js正则表达式的方式来判断是否是小数。 方法一:indexOf()方法判断是否是小数 function isDecimal(num){ if(String(num).indexOf('.') > -1){ return true; }else{ return... Web前端开发 / 2023-05-22 / 2687次阅读
javascript不刷新页面替换地址栏url的方法replaceState()和pushState() replaceState()和pushState()是HTML5中history对象新添加的两个方法,用来在浏览历史中添加或修改记录,通过这两个方法可以实现替换浏览器地址栏url而不刷新网页。 语法 history.replaceState(stateObj, title[, url]); history.pushState(stateObj, title[, url]); 两上方法的参数完全一... Web前端开发 / 2023-05-08 / 2033次阅读