AmazeUI 點(diǎn)擊元素顯示全屏的實(shí)現(xiàn)
無(wú)論是點(diǎn)擊圖片還是按鈕來(lái)顯示全屏,具體代碼如下:
點(diǎn)擊按鈕:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/amazeui.legacy.js"></script>
<script type="text/javascript" src="js/amazeui.js"></script>
<script type="text/javascript" src="js/amazeui.widgets.helper.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="js/handlebars.min.js"></script>
<script type="text/javascript" src="js/polyfill/rem.min.js"></script>
<script type="text/javascript" src="js/polyfill/respond.min.js"></script>
<link rel="stylesheet" href="css/amazeui.css" />
<link rel="stylesheet" href="css/bootstrap.css" />
<link rel="stylesheet" href="css/admin.css" />
<link rel="stylesheet" href="css/amazeui.flat.css" />
<link rel="stylesheet" href="css/app.css" />
<script type="text/javascript">
$(function(){
$('#demo-full-page').on('click',function(){
if($.AMUI.fullscreen.enabled){
$.AMUI.fullscreen.request();
}else{
//Ignore or do something else
}
})
});
</script>
</head>
<body>
<button id="demo-full-page" class="am-btn am-btn-primary">Fullscreen the page</button>
</body>
</html>
類似可以用于任何元素,也能達(dá)到這種效果。
AmazeUI卻是用起來(lái)挺方便快捷的。
到此這篇關(guān)于AmazeUI 點(diǎn)擊元素顯示全屏的實(shí)現(xiàn)的文章就介紹到這了,更多相關(guān)AmazeUI 點(diǎn)擊元素顯示全屏內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持腳本之家!
相關(guān)文章
這篇文章主要介紹了AmazeUI 按鈕交互的實(shí)現(xiàn)示例,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)2020-08-24
amazeui頁(yè)面校驗(yàn)功能的實(shí)現(xiàn)代碼
這篇文章主要介紹了amazeui頁(yè)面校驗(yàn)功能的實(shí)現(xiàn)代碼,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-08-24amazeui樹(shù)節(jié)點(diǎn)自動(dòng)展開(kāi)折疊面板并選中第一個(gè)樹(shù)節(jié)點(diǎn)的實(shí)現(xiàn)
這篇文章主要介紹了amazeui樹(shù)節(jié)點(diǎn)自動(dòng)展開(kāi)折疊面板并選中第一個(gè)樹(shù)節(jié)點(diǎn)的實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友2020-08-24
AmazeUI的JS表單驗(yàn)證框架實(shí)戰(zhàn)示例分享
這篇文章主要介紹了AmazeUI的JS表單驗(yàn)證框架實(shí)戰(zhàn)示例分享,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一2020-08-21amazeui 驗(yàn)證按鈕擴(kuò)展的實(shí)現(xiàn)
這篇文章主要介紹了amazeui 驗(yàn)證按鈕擴(kuò)展的實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)2020-08-21前后端結(jié)合實(shí)現(xiàn)amazeUI分頁(yè)效果
這篇文章主要介紹了前后端結(jié)合實(shí)現(xiàn)amazeUI分頁(yè),本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-08-21
AmazeUI 加載進(jìn)度條的實(shí)現(xiàn)示例
這篇文章主要介紹了AmazeUI 加載進(jìn)度條的實(shí)現(xiàn)示例,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)2020-08-20
AmazeUI折疊式卡片布局,整合內(nèi)容列表、表格組件實(shí)現(xiàn)
這篇文章主要介紹了AmazeUI折疊式卡片布局,整合內(nèi)容列表、表格組件實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下2020-08-20
這篇文章主要介紹了AmazeUI圖片輪播效果的示例代碼,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-08-20
這篇文章主要介紹了AmazeUI 平滑滾動(dòng)效果,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,,需要的朋友可以參考下2020-08-20




