ios - iPad HTML5 Video tag list and scrolling issue -
i building cross platform application based on phonegap.
testing app on ipad, using angularjs.
i have created list of media files using ng-repeat
below:
<div ng-repeat="media in mediaarray" style="width:200px; height:200px;"> <img ng-src="{{media.imgsrc}}" ng-hide="media.isvideo" style="width:200px; height:200px;" > <video id="video{{media.id}" ng-show="media.isvideo" postersrc="test.png" poster-src <!-- directive poster source fix --> controls style="width:200px; height:200px;" > <source type="video/mp4" videosrc="{{media.videourl}}" video-src <!-- directive video source fix --> > browser not support html5 video. </video> </div>
in list have images , video files.
able see list , able play video files.
but problem that, when play of video not able scroll list, scrolling works till don't play video once video played scrolling not work @ all. can issue?
try this
<div ng-repeat="media in mediaarray" ng-controller="scrollcontroller" style="width:200px; height:200px;"> <img ng-src="{{media.imgsrc}}" ng-hide="media.isvideo" style="width:200px; height:200px;" > <video id="video{{media.id}" ng-show="media.isvideo" postersrc="test.png" poster-src <!-- directive poster source fix --> controls style="width:200px; height:200px;" > <source type="video/mp4" videosrc="{{media.videourl}}" video-src <!-- directive video source fix --> > browser not support html5 video. </video> </div>
script controller
angular.module('anchorscrollexample', []) .controller('scrollcontroller', ['$scope', '$location', '$anchorscroll', function ($scope, $location, $anchorscroll) { $scope.gotobottom = function() { // set location.hash id of // element wish scroll to. $location.hash('bottom'); // call $anchorscroll() $anchorscroll(); }; }]);
Comments
Post a Comment