Skip to content

Instantly share code, notes, and snippets.

@riix

riix/ui.mobile.js

Created April 26, 2013 07:04
Show Gist options
  • Save riix/5465458 to your computer and use it in GitHub Desktop.
Save riix/5465458 to your computer and use it in GitHub Desktop.
Download ZIP
ui.mobile.js
Raw
ui.mobile.js
/*************************************************************************************************
* ui.mobile.js
*
* @Author : 박순길
* @Version 0.5
*
* @Searching List
* browser : Browser Detect
*
************************************************************************************************/
/* User Function ------------------------------ */
(function($) {
// img.imgToggle();
// img.imgToggle({ oldSrc: '_off', newSrc: '_on' });
$.fn.imgToggle = function(settings) {
var config = {
oldSrc : '_off', newSrc : '_on'
};
if (settings) $.extend(config, settings);
this.each(function() {
var $this = $(this);
if($this.attr('src')){
$this.attr('src',$this.attr('src').replace(config.oldSrc, config.newSrc));
}
});
};
// img.imgHover();
// img.imgHover({ oldSrc: '_off', newSrc: '_on' });
$.fn.imgHover = function(settings) {
var config = {
oldSrc : '_off', newSrc : '_on'
};
if (settings) $.extend(config, settings);
this.each(function() {
var $this = $(this);
$this.on('mouseenter',function() {
if ($this.attr('src') && $this.attr('src').match(config.oldSrc)) {
$this.attr('src', $this.attr('src').replace(config.oldSrc, config.newSrc));
$this.on('mouseleave',function() {
$this.attr('src', $this.attr('src').replace(config.newSrc, config.oldSrc));
});
}
});
});
};
})(jQuery);
var console = window.console || { log: function() {} }; // console 에러 방지
var isSearchList = false; // 검색결과 페이지 인지 변수
var $doc = $(document);
var $html = $('html');
var $window = $('#container');
var $container = $('#container');
var $aside = $('#aside');
var $body = $('#body');
var $windowHeight = $window.height();
var $bodyHeight = $body.height();
var $height = ( $windowHeight >= $bodyHeight ) ? $windowHeight : $bodyHeight ;
var $overlay = $('<div id="overlay"></div>'); // 반투명 오버레이
function riix(){
$html.removeClass('no-js').addClass('js '+riix.browser()); // browser detect
$bodyClass = $('body').attr('class');
if($bodyClass != null && $bodyClass.match('page-search')){
isSearchList = true; // 검색결과 페이지 인지 변수
searchbarToggle('on');
}
}
riix.browser = function(){
var $agent = navigator.userAgent.toLowerCase();
if($agent.match('firefox')){
return 'firefox';
} else if ($agent.match('msie')) {
var $browserhappy = $("<div id='browserhappy'>MS Internet Explorer 는 지원하지 않습니다.</div>");
$browserhappy.prependTo($body);
return 'ie';
}
}
$(function(){
riix();
// 페이지 높이 맞추기
$aside.height($height);
$body.height($height);
// aside 토글
$('#buttonAside, #aside h2 a').on('click',function(e){
e.preventDefault();
toggleAside();
});
// gnb 액션
$('#gnb a').on('click',function(e){
var $this = $(this);
var $next = $this.next()[0];
if($next != null && $next.tagName == 'OL'){
e.preventDefault();
$("#gnb li.d1 ol").slideUp();
$("#gnb li.d1 a.d1 img.arrow").attr('alt','펼치기').imgToggle({ oldSrc: '_on', newSrc: '_off' });
if(!$this.next().is(":visible")) {
$this.next().slideDown();
$this.children('img.arrow').attr('alt','접기').imgToggle({ oldSrc: '_off', newSrc: '_on' });
}
}
});
// 서치바 토글
$('#nav div.action a[href="#searchbar"]').on('click',function(e){
e.preventDefault();
searchbarToggle();
});
// 서치바 취소 버튼
$('#searchbar div.form button:last-child').on('click',function(e){
$(this).siblings('input.text').val('');
searchbarToggle('off');
});
// 서치바 검색 타입 버튼 토글
$('#searchbar div.category button').on('click',function(e){
$(this).addClass('button-s-active').siblings().removeClass('button-s-active');
});
// pagination
$('div.paginate a.no:eq(0)').addClass('no-first');
// gnb link
$('#gnb li a').on('click',function(e){
$this = $(this);
if($this.is('.logout')) { // 로그아웃
e.preventDefault();
var confirmLogout = confirm('로그아웃 하시겠습니까?');
if (confirmLogout == true){
alert('로그아웃 되었습니다.');
}
}
});
});
// gnb 활성화
function initGnb(d1,d2){
var $d1 = $('#gnb li.d1').eq(d1);
var $d2 = $d1.children('ol').children('li').eq(d2);
$d1.children('a').addClass('active').children('img.arrow').attr('alt','접기').imgToggle();
$d1.children('ol').slideDown();
if(d2 != null && $d2 != null) $d2.addClass('active');
}
// aside 토글
function toggleAside(){
searchbarToggle('off');
$body.toggleClass('active');
if($aside.data('active') == 'off'){
$body.transit({ marginLeft: '274px' });
$aside.data('active','on');
} else {
$body.transit({ marginLeft:'0%' });
$aside.data('active','off');
}
}
// 서치바 토글
function searchbarToggle(todo){
var $searchbar = $('#searchbar');
if($searchbar.is(':visible') || todo == 'off'){
if(isSearchList != true) $searchbar.slideUp();
$overlay.remove();
} else {
if(isSearchList != true){
$searchbar.slideDown().delay(100).promise().done(function(){
var $contentsTop = parseInt($('#contents').offset().top, 10);
$overlay.css({
'display':'block',
'marginTop': $contentsTop,
'height': $height-$contentsTop
}).appendTo($('body'));
});
} else {
$searchbar.show();
}
}
}
// 파일 입력상자 꾸미기
function fileDecoration(obj){
var $buttonFile = $('<button id="fileButton" class="button-c button-i"><img src="../img/common/ico_pic.png" alt="" />사진첨부</button>');
$('input[type="file"]').hide().on('change',function(){
$(this).after('&nbsp;&nbsp;<small>파일이 선택되었습니다.</small>');
}).before($buttonFile);
$buttonFile.on('click',function(e){
$(this).next().trigger('click');
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment