启动画面中的GIF文件离子 [英] GIF File in splash screen Ionic
本文介绍了启动画面中的GIF文件离子的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在开发一个带有离子框架和Cordova插件的混合应用程序。他们问我两个操作系统(iOS和Android)上的启动画面都有一个小动画。我想象一个GIF,但如果你可以加载GIF作为启动画面。或者如果有一个插件。
I am developing a hybrid application with ionic-framework and Cordova plugins. They asked me the splash screen on both operating systems (iOS and Android) has a small animation. I imagine a GIF but not if you can load a GIF as splash screen. Or if there is a plugin for this.
推荐答案
你可以这样做而不使用插件。 此处提供更多信息。
You can do it this way without using plugins. More information is available here.
HTML
<body>
<div id="custom-overlay"><img src="http://cdn.osxdaily.com/wp-content/uploads/2013/07/dancing-banana.gif"></div>
<!-- Here comes rest of the content -->
</body>
www / css / style.css
www/css/style.css
#custom-overlay {
display: flex;
flex-direction: column;
justify-content: center;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 100;
background-color: #fe201f;
}
#custom-overlay img {
display: block;
margin: 0 auto;
width: 60%;
height: auto;
}
www / js / app.js
www/js/app.js
.run(function($ionicPlatform, $state, $cordovaSplashscreen) {
$ionicPlatform.ready(function() {
if(navigator.splashscreen) {
$cordovaSplashscreen.hide();
}
});
});
.controller('ListCtrl', function($scope) {
$scope.$on('$ionicView.afterEnter', function(){
setTimeout(function(){
document.getElementById("custom-overlay").style.display = "none";
}, 3000);
});
});
这篇关于启动画面中的GIF文件离子的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文