- 博客(30)
- 资源 (1)
- 收藏
- 关注
RSS订阅转载 左右滑动
最终效果如上。问题： 1、tab标题总共8个，所以一屏无法全部显示。 2、tab内容区左右滑动切换时，tab标题随即做标记（active）。 3、当active的标题不在当前屏显示时，要使其能显示到当前屏中。tab标题因一排八个，所以使用 scroll-view组件，使其可横向滚动。 tab内容可左右滑动切换，使用swiper组件实现 为了偷懒，所以数据都通过wx:for遍历重复...
2018-09-12 14:11:05
629
原创 小程序——改变轮播图圆点样式
<view class="wrap"><swiper class="swipers" autoplay="{{autoplay}}" current="{{currentSwiper}}" bindchange="swiperChange"><block wx:for="{{imgs}}" wx:key=&quo
2018-09-10 15:56:15
7275
1
原创 小程序——弹窗
<!--button--><view class="btn" bindtap="powerDrawer" data-statu="open">button</view><!--mask--><view class="drawer_screen" bindtap="powerDrawe
2018-09-10 12:29:55
396
原创 小程序——左右页面来回滑动
<view class="class_first" bindtouchstart="touchStart" bindtouchend="touchEnd">滑动切换页面</view> .class_first { width: 100%;height: 1334rpx;background-color: red} ...
2018-09-10 11:13:56
6349
1
原创 小程序——五星评分
<block wx:for="{{stars}}" wx:key="stars"><image class="star-image" style="left: {{item*150}}rpx" src="{{key > item ?(key-item == 0.5?halfSrc:selectedSrc):normalSrc}}">
2018-09-05 13:59:24
482
转载 微信小程序 for循环嵌套怎么取值
外层循环正常嵌套，内层循环嵌套的时候，把item.swiper_buy作为数组循环wx:for="{{item.swiper_buy}}"，然后给item重新命名wx:for-item="cell"，内部循环的时候，就是{{cell.属性}} <block wx:for="{{swiper_object}}" wx:key="index"> <swiper-ite...
2018-08-15 15:00:15
6569
转载 点击轮播js
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>标准轮播图</title></head><style type="text/css&quo
2018-08-13 14:49:53
126
转载 js 小练习，鼠标经过内容改变
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <...
2018-08-09 16:17:23
905
原创 用if语句根据不同量显示合计金额
//第一步//第二步 wxml中所有需要显示数据都必须在page中data定义//第三步 被用到的变量需定义，如原本在page data中的数据更改的话需用setdata进行更改这么简单的我都不会真是傻了，成天学的是什么呀？my god！ ...
2018-08-09 09:44:58
413
原创 点击加一减一
<input type="button" onclick="sub()" value="-"> <input type="text" id="txt" value="1"/><input type="button" onclick="add()" value="
2018-08-01 14:44:59
1695
原创 小程序——点击按钮，样式不一样
<view class='shuliang'><view class='shuliang_p'>购买数量</view><view class='wrap'><view class='ping {{amoutIndex==1?"shu":""}}' bindtap='buy' id='1'>30瓶</v
2018-07-27 17:11:50
988
原创 小程序中部导航
<view class='content'><view class='content_list' wx:for="{{navArray}}" wx:key="navArray"><image src='{{item.image}}' ></image><view class='content_list_p'>
2018-07-19 17:41:15
545
原创 小程序头部轮播
<swiper indicator-dots="true"circular="true"autoplay="true"interval="5000"duration="500"class="index_banner" indicator-active-color="#46b812"indicator-color="
2018-07-19 10:31:04
325
原创 微信小程序字数限制
<view class="xinxi"><textarea placeholder='请提供详细的设备故障信息' minlength="{{min}}" maxlength="{{max}}" bindinput="inputs"><text class="currentWordNumber">{{currentWor
2018-07-19 08:42:54
8570
原创 下拉菜单
下拉菜单<li class="chan"><a href="product.html">产品中心<img src="images/sanjiao.jpg"></a><ul class="nav_2"><li><a href="#"
2018-07-06 10:48:25
300
原创 微信小程序字幕滚动
<!--index.wxml--><swiper class="swiper_container" vertical="true" autoplay="true" circular="true" interval="1000"> <block wx:for="{{msgList}}"> <na
2018-07-02 11:25:05
9697
转载 div中间十字线
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>1</title> <style> *{ padding: 0; marg
2018-06-29 11:18:35
2166
转载 简单
<style> body{text-align: center} #box{width:400px;height:400px;border:5px solid #e5e5e5;margin:20px auto;position:relative;} #img{width:100%;height:100%;} #text1{widt...
2018-06-28 09:51:19
127
转载 js轮播
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>轮播图</title> <style> * { margin:0; padding:0; } a{ text-decorati
2018-06-28 09:46:33
178
原创 下拉菜单
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> ul{ list-style: no
2018-06-20 20:56:30
187
转载 下拉导航
* { margin:0; padding:0;}li { list-style:none;}.nav1 { width:1200px; height:60px; background:#69bded; margin:0 auto;}#nav .nav1 ul li { width:200px; line-height:60px; text-align:center; background:#69...
2018-06-19 13:59:55
163
转载 8款搜索
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <titl
2018-06-19 12:45:14
96
原创 怎么查看网站是用什么编程语言开发的？
依次在网站后面加域名+index.php，index.asp,index.jsp,index.apsx,defualt.php,defualt.asp,default.jsp,default.aspx能正常打开该网站的就是用什么语言来做的
2018-06-14 17:42:05
6091
原创 文字向上滚动
<div class="wrap"> <div class="content"><p>第一行数据</p><p>第二行数据</p> </div> </div> .wrap{height:30px;overflow: hidden;
2018-06-05 17:52:19
136
转载 css动画样式库
@import url(http://fonts.googleapis.com/css?family=Poiret+One);*,*:before,*:after { box-sizing: border-box; margin: 0; padding: 0;}:root,html,body { font-family: 'Poiret One', 'Open Sans',...
2018-06-05 16:25:21
384
转载 图片滚动（简单）
<!DOCTYPE><html><head> <meta charset="utf-8"/> <title>下划线动画</title> <style> * { margin:0px; padding:0px;}#banner { width:100%; height:50
2018-06-05 16:03:29
575
翻译 css3实现图片平滑过渡（华美）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE-edge,chrome=1"> <meta
2018-06-05 15:43:23
4132
转载 经过图片时慢慢放大缩小
<!DOCTYPE><html><head> <meta charset="utf-8"/> <title>下划线动画</title> <style> *{ margin: 0; padding: 0;}#pic{ width: 212px; height: 300p
2018-06-05 13:51:59
526
转载 下划线动画
下划线从左到右效果<!DOCTYPE><html><head> <meta charset="utf-8"/> <title>下划线动画</title> <style> /*先把a的原有下划线样式给清除*/ a,a:link,a:visited,a:
2018-06-05 10:56:38
392
转载 鼠标移入菜单文字出现下划线
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title&am
2018-06-05 10:23:36
4269
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人