Codes & Downloads

jQuery Plugins

NicoNoSlider
NicoNoSlider is a very light jQuery slider plugin.
NicoNoReorganize
NicoNoReorganize is a jQuery plugin that reorganize elements in a grid template.
NicoNoZoom
NicoNoZoom is a jQuery plugin that simulates a zoom effect on an image.
imageSwiper
imageSwiper is a jQuery plugin that simulates a swipe effect between two images.
NicoNoScrollbar
NicoNoScrollbar is a jQuery plugin that allow to generate a custom vertical scrollbar.

jQuery / Javascript

NicoNoPaint
With NicoNoPaint you can draw simple 8bits like shapes and export it as an png image.
I will add Paint like tools when I will find time to...
NicoNoKanji
Kanji drill training !

Usefull CSS memo

/* BOX SIZING */
-webkit-box-sizing:border-box;
box-sizing:border-box;


/* TRANSITION */
-webkit-transition:opacity 0.3s ease-out;
transition:opacity 0.3s ease-out;


/* BORDER RADIUS */
-webkit-border-radius:0px;
border-radius:0px;


/* TABLE BORDER COLLAPSE */
border-collapse:collapse;


/* IMAGE RENDERING FOR CHROME */
image-rendering:-webkit-optimize-contrast;

/* INHERIT ON RETINA DISPLAY */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){
   image-rendering:inherit;
}


/* FONT SMOOTHING FOR CHROME */
webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;


/* PREVENT TEXT ADJUST FOR LANDSCAPE SMARTPHONES */
text-size-adjust:none;
-webkit-text-size-adjust: none;


/* JAPANESE FONTS LETTER WIDTH */
font-feature-settings : "palt" 1;


/* AUTO COUNTER INCREMENT */
li{
    counter-increment:count-number; 
}
li:after{
    content:counters(count-number,"");
}


/* RESPONSIVE YOUTUBE EMBED VIDEO */
.youtubeBox{
    position:relative;
    height:0;
    overflow:hidden;
    padding-bottom:56.3%;
    padding-top:0;
}
.youtubeBox video,
.youtubeBox iframe,
.youtubeBox object,
.youtubeBox embed{
    border:none;
    width:100%;
    height:100%;
    position:absolute;
    left:0;
    top:0;
}


/* CROSS BROWSER ANIMATION */
.animation{
    animation:1s steps(1) 0 normal forwards 1 keyframename;
    -webkit-animation-name: keyframename;
    -webkit-animation-duration:1s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: steps(1);
    -webkit-animation-delay: 0;
    -webkit-animation-direction: normal;
    -webkit-animation-fill-mode: forwards;
}
@-webkit-keyframes keyframename{
    0%{width:130px}
    100%{width:130px}
}
@keyframes keyframename{
    0%{width:130px}
    100%{width:130px}
}

/* PAUSE ANIMATION */
-webkit-animation-play-state: paused;
animation-play-state: paused;

Usefull javascript / jQuery memo

// CHECK FOR MOBILE DEVICE
var isMobile = function(){return /(iphone|ipod|ipad|android|blackberry|windows ce|palm|symbian)/i.test(navigator.userAgent);};


// SET / STOP TIMEOUT AND INTERVAL
var timeout = setTimeout(function(){
    /* DO SOMETHING */
},200);
clearTimeout(timeout);

var interval = setInterval(function(){
    /* DO SOMETHING */ 
},200);
clearInterval(interval);


// VARS MANIPULATIONS
var.indexOf('string');
var.substring(start,stop);
var.split('string');
var.replace('search', 'replace');


// GET URL
var get = window.location.href;


// SCROLL AND ELEMENT POSITION
var scrollValue = $(window).scrollTop();
$('html,body').scrollTop(scrollValue);
var elementTop = $('element').offset().top;