zoukankan      html  css  js  c++  java
  • Ionic2 渐变隐藏导航栏|标题栏

    废话少说 直接上代码....

    //导入需要用到的命名空间 ViewChild,Content
    import { Component, ViewChild } from '@angular/core';
    import { NavController, ModalController, ToastController, Content } from 'ionic-angular';
    
    @Component({
      selector: 'home',
      templateUrl: 'home.html',
    })
    export class HomePage {
      @ViewChild(Content) content: Content;  //获取界面Content的实例对象
    
     //获取滑动的TOP值,并在200px时使标题栏达到透明 onPageScroll(event) { let position = event.target.scrollTop;//取滑动TOP值 this.transrate = 2 - position / 100; document.getElementById("home_title").style.opacity = this.transrate.toString();   // this.content.resize(); console.log(position); }
     //界面初始化时注册界面滑动事件 ngAfterViewInit() { this.content.addScrollListener(this.onPageScroll); } }




    //界面代码
    给标题栏加个ID即可
    <ion-header style="opacity:0" id="home_title">

      

  • 相关阅读:
    自定义控件绘制画圆
    SQLite Database Browser 2.0使用方法
    C#学习基础概念二十五问
    C# 导出Excel的示例
    三元表达式
    界面布局(上)
    C# 反射总结
    结对作业第二次
    代码复审
    继Junit....
  • 原文地址:https://www.cnblogs.com/super-cj/p/6262381.html
Copyright © 2011-2022 走看看