【发布时间】:2015-05-08 06:27:09
【问题描述】:
如下图所示:
我想要视频容器不可滚动(静态),但视频容器下的列表应该是可滚动的。
我该如何在 Ionic 框架中做到这一点?
我尝试为视频容器设置绝对位置并将列表放置在容器上方。但如果我在列表中滚动,视频也在移动。
非常感谢您的帮助:
模板在这里:
<ion-view title="{{ 'TIMELAPSE_VIDEOS' | translate }}"
ng-controller="VideoCtrl as controller">
<ion-nav-buttons side="left">
<button menu-toggle="left"class="button button-icon icon ion-navicon"></button>
</ion-nav-buttons>
<ion-nav-buttons side="right">
<button ng-click="toggleFullScreen()" menu-toggle="left"
class="button button-icon icon ion-arrow-expand"></button>
</ion-nav-buttons>
<ion-content class="has-header aboutAppContent" >
<div class="videogular-container">
<videogular vg-player-ready="controller.onPlayerReady($API)"
vg-loop="controller.config.loop"
vg-theme="controller.config.theme.url">
<vg-media vg-src="controller.config.sources"
vg-tracks="controller.config.tracks">
</vg-media>
<vg-controls>
<vg-play-pause-button></vg-play-pause-button>
</vg-controls>
<vg-buffering></vg-buffering>
<vg-poster vg-url='controller.config.plugins.poster'></vg-poster>
</videogular>
</div>
<div class="list" id="videoListWrappper">
<a class="item item-thumbnail-left"
ng-repeat="timelapseVideo in availableTimelapseVideos">
<div class="menuItemcircle">
<div class="menuItemcircleIconBtn">
<button ng-click="controller.setVideo($index)" class="button button-icon icon ion-play customIconSound"></button>
</div>
</div>
<h2 class="customHeadingForTrackName">{{timelapseVideo.name}} </h2>
<h3 class="customHelpText">{{ 'TAP_TO_PLAY_VIDEO' | translate }}</h3>
</a>
</div>
</div>
</ion-content>
</ion-view>
【问题讨论】:
-
你找到并回答了吗?
标签: html css css-position ionic-framework ionic