TypechoJoeTheme

轩宇网

搜索到 5 篇与 width 的结果
2019-10-21

微信小程序实现左侧滑动导航栏

微信小程序实现左侧滑动导航栏
这篇文章主要为大家详细介绍了微信小程序实现左侧滑动导航栏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下本文实例为大家分享了微信小程序实现左侧滑动导航栏的具体代码,供大家参考,具体内容如下左侧滑动导航栏如图wxml<!-- 左侧滚动栏 --> <view class='under_line'></view> <view style='float: left' class='left'> <scroll-view scroll-y scroll-with-animation scroll-left="{{scrollLength}}" class='scrollY' style='height: {{winHeight}}px'> <view class='all clear'> <block wx:key="lists" wx:for="{{lists}}"> <view bindtap='ju...
2019年10月21日
5,628 阅读
0 评论
2019-01-23

微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能

微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能
这篇文章主要介绍了微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能,涉及微信小程序map组件结合微信API获取天气信息相关操作技巧,需要的朋友可以参考下本文实例讲述了微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能。分享给大家供大家参考,具体如下:效果图实现原理采用高德地图微信小程序开发API(getWeather),如果 city 属性的值为空(或者没有city属性),默认返回定位位置的天气数据;如果 city 不为空,则返回 city 指定位置的天气数据。WXML<view class="map-weather">  <view><text>城市:</text>{{address}}</view>  <view><text>天气:</text>{{weather}}</view>  <view><text>温度:</text>{{temperature}}℃</view...
2019年01月23日
5,631 阅读
0 评论
2018-09-17

JavaScript编写点击查看大图的页面半透明遮罩层效果实例

JavaScript编写点击查看大图的页面半透明遮罩层效果实例
这个效果用的很频繁,经常都会有人问我这个问题,所以要把它写成文章。下次再有人问就直接把这篇文章的URL丢出去就好了。这个效果很简单所以我就不做太多说明了,具体的看看代码注释就会明白。下面就是全部代码,复制到HTML中就可以运行的。具体代码如下:<!DOCTYPE html> <style> #mask { position:fixed;width:100%; top:0px;left:0px; _position:absolute; _top:expression(documentElement.scrollTop); background:rgba(0,0,0,0.5); background:transparent\9; filter:progid:DXImageTransform.Microsoft.Gradient( startColorStr=#80000000,endColorStr=#80000000 ); display:none; } #mask_td {text-align:center;} </style&g...
2018年09月17日
5,274 阅读
0 评论
2018-08-15

jQuery实现导航样式布局操作示例【可自定义样式布局】

jQuery实现导航样式布局操作示例【可自定义样式布局】
这篇文章主要介绍了jQuery实现导航样式布局操作,可实现基于jQuery的用户自定义样式布局与属性动态操作相关技巧,需要的朋友可以参考下1、导航Html<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>www.jb51.net 导航样式布局</title> <link rel="stylesheet" href="style.css" rel="external nofollow" > <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <script src="nav.js"></script> <...
2018年08月15日
5,770 阅读
0 评论
2018-08-12

javascript实现列表的响应式排版(推荐)

javascript实现列表的响应式排版(推荐)
列表的响应式排版,首先每行固定好个数,然后随页面宽度调整个数和大小,保证图片的的可读性及美观。接下来小编给大家带来实现思路介绍,一起看看吧先给大家展示下效果图,如果感觉还不错,请参考实现代码。一、每行固定个数:保证排版的美观.list li{ width:20%;display:inline-block; *display:inline;*zoom:1;overflow:hidden; }二、随页面宽度调整个数和大小:保证图文的可读性.list li{ width:20%;display:inline-block; *display:inline;*zoom:1;overflow:hidden; }1、媒体查询控制宽度@media screen and (max-width:1280px){ .list-table1 li{width:25%} } @media screen and (max-width:600px){ .list-table1 li{width:33.3%} } @media screen and (max-width:400px){ .list-table1...
2018年08月12日
5,255 阅读
0 评论