jQuery Mobile
- snippet:
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script>
-
and_181130Android 2018. 11. 30. 22:07
cordova + AJAX
아이오닉 + 앵글러JS
https://developers.google.com/speed/libraries/
d3 차트 그리는 용도
jQuery
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
jQuery UI
- snippet:
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css"> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
디버깅chrome://inspect/#devices이것때문에 jquery 충돌이 난다.<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">디폴트 화면을 없애기 위해
index.css 에 값을 수정한다.
index.html
<!DOCTYPE html>
<html>
<head>
<!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">-->
<meta charset="utf-8">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/index.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
</head>
<title>Hello World</title>
<body>
<div class="app" id="app">
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</body></html>
index.js
var app = {
// Application Constructor
initialize: ()=> {
document.addEventListener('deviceready', this.onDeviceReady.on(this), false);
},
onDeviceReady: ()=> {
$('#app').html('<button id="onBtn">전구 불켜기</button>'+
'<img id ="bulbimg" />'+
+'<button id="offBtn">전구 불끄기</button>');
this.receivedEvent();
},
// Update DOM on a Received Event
receivedEvent: ()=> {
var onBtn = $('#onBtn');
var offBtn = $('#offBtn');
var bulbimg = $('#bubimg');
window.addEventListener("load",()=>{
bulbimg.attr('src','https://www.w3schools.com/js/pic_bulboff.gif')
.css('width','100px');
})
onBtn.click(()=>{
bubimg.attr('src','https://www.w3schools.com/js/pic_bulbon.gif')
.css('width','100px');
});
offBtn.click(()=>{
bubimg.attr('src','https://www.w3schools.com/js/pic_bulbon.gif')
.css('width','100px');
});
}
};
app.initialize();고친 형태
var app = {
initialize: ()=> {
app.onCreate();
},
onCreate: ()=> {
app.setContentView();
var onBtn = $('#onBtn');
var offBtn = $('#offBtn');
var bulbimg= $('#bulbimg');
window.addEventListener("load",()=>{
bulbimg
.attr('src','https://www.w3schools.com/js/pic_bulboff.gif' )
.css('width','100px');
});
onBtn.click(()=>{
bulbimg
.attr('src','https://www.w3schools.com/js/pic_bulbon.gif')
.css('width','100px');
});
offBtn.click(()=>{
bulbimg
.attr('src','https://www.w3schools.com/js/pic_bulboff.gif' )
.css('width','100px');
});
},
setContentView : () =>{
$('#app').html('<div id="box"><button id="onBtn">ON</button>'+
'<img id="bulbimg"/>'+
'<button id="offBtn">OFF</button></div>')
;
$('#box').css('margin-top','100px');
}
};
app.initialize();https://developers.kakao.com/docs/restapi/kakaotalk-api
http://kakaomap.tistory.com/category/%EC%A7%80%EB%8F%84%20%ED%99%9C%EC%9A%A9%20%EC%95%88%EB%82%B4/%EC%A7
%80%EB%8F%84%20%EC%98%A4%ED%94%88%20API
repositories { mavenCentral() maven { url 'http://devrepo.kakao.com:8088/nexus/content/groups/public/' }
}
repositories {
mavenCentral()
maven {
url "http://devrepo.kakao.com:8088/nexus/content/groups/public/"
}
jcenter()
google()
}http://liveonthekeyboard.tistory.com/147
카카오 API 참고
'Android' 카테고리의 다른 글
and_181204 (0) 2018.12.04 And_181203 아이오닉+앵귤러JS 세팅 (0) 2018.12.03 And_181128 (0) 2018.11.28 2018_11_27 구글맵사용_hybrid (0) 2018.11.27 폰으로 테스트 구동할시에 설정 (user permission) (0) 2018.11.26
