jquery 사용해본 플러그인

이미지 슬라이드

http://workshop.rs/projects/jqfancytransitions/

<script src="./img/jqFancyTransitions.1.8.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function() {

$('#slideshowHolder').jqFancyTransitions({

width : 800,

height : 400,

effect : 'curtain', // wave, zipper, curtain

strips : 7, // number of strips

delay : 5000, // delay between images in ms

stripDelay : 50, // delay beetwen strips in ms

titleOpacity : 0.7, // opacity of title

titleSpeed : 1000, // speed of title appereance in ms

position : 'top', // top, bottom, alternate, curtain

direction : 'fountainAlternate', // left, right, alternate, random, fountain, fountainAlternate

navigation : false, // prev and next navigation buttons

links : false

// show images as links

});

});

<div id='slideshowHolder' style="margin: 0 auto;">

<img src='./img/1.jpg' /> <img src='./img/2.jpg' /> <img

src='./img/3.jpg' /> <img src='./img/4.jpg' /> <img

src='./img/5.jpg' />

</div>

텍스트 변환

http://alvarotrigo.com/funnyText/

<link rel="stylesheet" type="text/css" href="./img/jquery.funnyText.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script type="text/javascript" src="./img/jquery.funnyText.js"></script>

<script type="text/javascript">

$(document).ready(function() {

$('.mySelector').funnyText({

speed : 1000,

borderColor : 'white',

activeColor : 'black',

color : 'orange',

fontSize : '5em',

direction : 'both'

});

});

</script>

<div class="mySelector" style="margin: 100px auto;" align="center">

Orange Page </div>