Skip to content

Instantly share code, notes, and snippets.

@melomano
melomano / index.html
Created November 8, 2012 01:22
CSS: Panel Menu
<nav class="main-nav" id="main-nav">
<a href="#">This</a>
<a href="#">Little</a>
<a href="#">Piggy</a>
<a href="#">Went</a>
<a href="#">To</a>
<a href="#">Market</a>
</nav>
<div class="page-wrap">
@melomano
melomano / index.html
Created November 9, 2012 00:48
CSS: Toggle Checkbox(iPhone Style)
<div class="toggle">
<input type="checkbox" id="toggle1" />
<div class="toggle-handle"></div>
<label for="toggle1" onclick></label>
</div>
@melomano
melomano / normalize.css
Created November 13, 2012 08:39
CSS: Normalize(Mobile)
* {
-webkit-box-sizing: border-box;
box-sizing: border-box;
background-repeat: no-repeat;
vertical-align: middle;
-webkit-tap-highlight-color: rgba(0,0,0,0);
tap-highlight-color: rgba(0,0,0,0);
-webkit-appearance: none;
appearance: none;
-webkit-focus-ring-color: rgba(0,0,0,0);
@melomano
melomano / common.css
Created November 13, 2012 08:55
CSS: Common(Mobile)
@import 'normalize.css';
/*
* HTML5 Boilerplate
*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/
@melomano
melomano / ellipsis_line.css
Created November 15, 2012 05:34
CSS: 줄 단위 말 줄임 처리
/* 줄 단위 말 줄임 처리 */
.ellipsis-line {
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;/* 줄 수 */
}
@melomano
melomano / format_money.js
Created November 15, 2012 06:14
JS: Format Money
var formatMoney = function(nStr) {
var x, x1, x2, rgx;
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
rgx = /(\d+)(\d{3})/;
while(rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
@melomano
melomano / index.html
Created November 27, 2012 15:02
Vertical flex:1 with overflow scrolling
<header>Header</header>
<ul>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
@melomano
melomano / data.js
Created December 18, 2012 00:54
JS: Data Util
var Data = function() {
var warehouse = {};
var count = 1;
return {
reset: function() {
count = 1;
warehouse = {};
},
set: function(dom, data) {
if(!dom.__data) {
@melomano
melomano / AJAXGetHTML
Created July 1, 2014 01:14
AJAXGetHTML
/**
* AJAX 로 HTML 가져오기
* @param {String} html 가져올 HTML 파일명
* @param {String} targetId HTML 을 삽입할 곳의 ID. 지정 안 하면, body 종료 엘리먼트 바로 앞에 삽입.
*/
var ajaxGetHtml = function(html, targetId, callback) {
var xmlhttp = new XMLHttpRequest();
xmlhttp.open('GET', html + '.html', true);
xmlhttp.send();
xmlhttp.onreadystatechange = function() {
@melomano
melomano / Calendar
Created July 1, 2014 01:15
Calendar
var now = new Date(),
nowYear = now.getFullYear(),
nowMonth = now.getMonth(),
nowDate = now.getDate();
// 캘린더
// 사용법: Calendar.drawCal(year, month, document.getElementById('calendar-body'));
// month 는 0부터 11까지임.
var Calendar = {