基于python实现MUI区域滚动

目录
  • 1、前言
  • 2、问题描述
  • 3、解决方案
  • 4、结语

本文转自微信公众号:"算法与编程之美"

Python用HBuilder创建交流社区APP
基于Python实现MUI侧滑菜单a标签跳转
基于Python 优化 MUI标题栏
基于python使MUI登录页面的美化

1、前言

MUI提供了区域滚动的组件,使用时遵循DOM结构就可以。若是需要使用区域滚动的组件,就需要初始化scroll控件。本次在制作页面时关于区域滚动遇到了一些问题将会在下文展开。

2、问题描述

在创建好区域滚动之后不能够按照预想状态横向滚动,按照MUI官网上给出的代码敲入之后所有的内容都停留在了最左的界面,不能够根据横向滚动的class来具体放置。

示例:

图上的商品介绍、商家、评价原本应为区域滚动的三个部分,在将各个部分的内容对应添加上去时,全部都呈现在了一个页面。而且在滚动时下方的蓝色条并不能随之滚动,但字体会变为蓝色。

3、解决方案

查看html上的代码,可以发现在<div id="item1mobile" class="md-f1 mui-slider-item mui-control-contentdetailInfos md-box md-ver mui-active"><div>之后是直接使用了divclass加上之后的图片内容。

其实我们只用加入ul组件,再去调用图片与内容,就不会出现以上的情况了。

比如: <ulclass="mui-table-view"></ul> ,在每一个滚动区域都这样使用,就可以正常的进行区域滚动了

4、结语

这次的问题是在对页面进行优化时发现的,修改之后整个页面都美观了许多。当遇到这类的问题的时候其实应该仔细检查,只要是有一定的基础都可以发现这个问题并进行改正。

到此这篇关于基于python实现MUI区域滚动的文章就介绍到这了,更多相关MUI区域滚动内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • 基于Python 优化 MUI标题栏

    目录 一.前言 二.问题描述 三.解决方案 1.  创建一个带返回键标题栏 2.更改标题栏的背景颜色 3.更改标题栏的字体颜色 4.更改标题栏的字体 四.结语 本文转自微信公众号:"算法与编程之美" 一.前言 三步搭建MUI页面主框架法包括新建含mui的HTML文件.输入mheader(标题栏).输入mbody(主体).一个特色鲜明MUI界面无疑是能够吸引用户的关键之一,这利用css和JavaScript可以很快进行实现,但是同时对于初学者来说也是困难的,这就需要几个简单的小技巧实现页

  • 基于python使MUI登录页面的美化

    目录 1.前言 2.问题描述 3.解决方案 (1)背景美化 (2)输入框美化 4.结语 本文转自微信公众号:"算法与编程之美" 1.前言 之前的文章Python用HBuilder创建交流社区APP我们已经在HBuilder上创建的APP ,现HBuilder中已经有了登录页面的相关的html文件,但是按照html已有的页面来看,它缺少外观的美化.现在大多数软件需要外观的加成,本篇文章主要讲的是MUI登录页面的美化. 2.问题描述 在将主要的内容构造之后,如今思考如何实现将页面进行美化是

  • 基于Python实现MUI侧滑菜单a标签跳转

    目录 1.前言 2.问题描述 3.解决方案 4.结语 本文转自微信公众号:"算法与编程之美" 1.前言 侧滑是一个非常实用的选项组件,它在Android App应用中非常广泛,常见的场景有:下拉刷新,侧滑抽屉,侧滑删除,侧滑返回以及侧滑菜单等.就是因为侧滑应用太过于广泛,它所带来的问题也是应接不暇. 2.问题描述 在实际操作过程中,实现侧滑菜单带来了那么一个问题,侧滑菜单已经实现,但是侧滑导航的子选项卡里的内容要如何实现跳转,通常想到的办法便是建立<a>标签选项卡进行her

  • 基于python实现MUI区域滚动

    目录 1.前言 2.问题描述 3.解决方案 4.结语 本文转自微信公众号:"算法与编程之美" Python用HBuilder创建交流社区APP 基于Python实现MUI侧滑菜单a标签跳转 基于Python 优化 MUI标题栏 基于python使MUI登录页面的美化 1.前言 MUI提供了区域滚动的组件,使用时遵循DOM结构就可以.若是需要使用区域滚动的组件,就需要初始化scroll控件.本次在制作页面时关于区域滚动遇到了一些问题将会在下文展开. 2.问题描述 在创建好区域滚动之后不能

  • Vue cli+mui 区域滚动的实例代码

    vue cli+mui配合使用达到区域滚到的效果 ,方法如下 第一步 引入mui css js @import url("/static/mui.min.css"); JS import mui from '../../../static/mui.min.js'; 第二步 写结构 mui的区域滚动结构是这样的 <div class="mui-scroll-wrapper"> <div class="mui-scroll">

  • 基于Python实现PDF区域文本提取工具

    目录 功能简介 开发代码 功能简介 打开软件后界面如下: 点击打开文件按钮打开之前的PDF文件后效果如下: 框选区域后,标题栏会自动显示当前框选的区域提取到的文字,还可以左右按钮切换: 实际我们需要提取文字的区域可能不止这一个,所以程序支持多区域框选: 完成区域框选后就可以点击保存文件,将PDF每页提取到的文本保存到一个csv文件中,当前选区的保存结果如下: 可以看到已经按框选顺序依次保存了每一个区域的字符串. 如果选择区域时发现提取结果不准确,可以撤销后重新选择: 保存图片则会将PDF的每页的

  • 基于python计算滚动方差(标准差)talib和pd.rolling函数差异详解

    我就废话不多说了,大家还是直接看代码吧! # -*- coding: utf-8 -*- """ Created on Thu Apr 12 11:23:46 2018 @author: henbile """ #计算滚动波动率可以使用专门做技术分析的talib包里面的函数,也可以使用pandas包里面的滚动函数. #但是两个函数对于分母的选择,就是使用N还是N-1作为分母这件事情上是有分歧的. #另一个差异在于:talib包计算基于numpy,

  • AngularJS基于ngInfiniteScroll实现下拉滚动加载的方法

    本文实例讲述了AngularJS基于ngInfiniteScroll实现下拉滚动加载的方法.分享给大家供大家参考,具体如下: 1.分页加载数据的基础上,如何通过滚动加载,实现分页加载数据的效果,github上,针对AngularJS,有一款不错的插件,地址为:https://github.com/sroze/ngInfiniteScroll 2.下面来看官方给出的文档 (1)使用样例: <ANY infinite-scroll='{expression}' [infinite-scroll-di

  • 基于jQuery的上下无缝滚动应用(单行或多行)

    核心jQuery代码: 复制代码 代码如下: $(function(){ var _wrap=$('ul.line');//定义滚动区域 var _interval=2000;//定义滚动间隙时间 var _moving;//需要清除的动画 _wrap.hover(function(){ clearInterval(_moving);//当鼠标在滚动区域中时,停止滚动 },function(){ _moving=setInterval(function(){ var _field=_wrap.f

  • 基于Python的文件类型和字符串详解

    1. Python的文件类型 1. 源代码--直接由Python解析 vi 1.py #!/usr/bin/python print 'hello world' 这里的1.py就是源代码 执行方式和shell脚本类似: chmod +x 后,./1.py Python 1.py 2. 字节代码 Python源码文件经编译后生成的扩展名为pyc的文件 编译方法: [root@t1 py]# cat 2.py #!/usr/bin/python import py_compile py_compil

随机推荐