私が見た限りでは、このプラグインは動作するために特定のバージョンを必要としません。おそらく、 1 つのjQuery バージョン (たとえば 1.8.3) を使用するだけの場合です。
<head>
...
<!-- (change) -->
<script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script> **1st JQUERY**
...
<script>
...
<!-- remove-->
$.noConflict(true);
...
</script>
</head>
<body>
<!-- (remove) -->
<script type="text/javascript" src="scripts/jquery-1.7.1.js"></script> **2nd JQUERY**
...
</body>
幸運を
2 つのプラグインが連携している例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="keywords" content="javascript, jquery, plugins, scroll, anchor, to, navigation, ajax, scrollTo, smooth, animation, overflow, element, window, effect, lazy, customizable, ariel, flesler">
<meta name="description" content="Demo of jQuery.LocalScroll. A jQuery plugin to make anchor navigation work with a smooth animation, made by Ariel Flesler.">
<meta name="robots" content="all">
<meta name="author" content="Ariel Flesler, aflesler(at)gmail(dot)com">
<meta name="copyright" content="(c) 2007-2008 Ariel Flesler">
<title>jQuery.LocalScroll - Regular Demo</title>
<link rel="shortcut icon" href="http://jquery.com/favicon.ico" type="image/x-icon">
<link href="http://flesler.com/base.css" type="text/css" rel="stylesheet">
<link href="http://flesler.com/jquery/localScroll/css/style.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="http://flesler.com/jquery/localScroll/../scrollTo/js/jquery.scrollTo-min.js"></script>
<script type="text/javascript" src="http://flesler.com/jquery/localScroll/js/jquery.localscroll-min.js"></script>
<script type="text/javascript" src="http://tympanus.net/Development/ParallaxContentSlider/js/jquery.cslider.js"></script>
<script type="text/javascript" src="http://tympanus.net/Development/ParallaxContentSlider/js/modernizr.custom.28468.js"></script>
<script type="text/javascript" src="http://flesler.com/jquery/localScroll/js/init.js"></script>
<link rel="stylesheet" type="text/css" href="http://tympanus.net/Development/ParallaxContentSlider/css/demo.css">
<link rel="stylesheet" type="text/css" href="http://tympanus.net/Development/ParallaxContentSlider/css/style2.css">
<!-- Timestamp: 1365350712 -->
<style type="text/css">@media print { #feedlyMiniIcon { display: none; } }</style></head>
<body data-feedly-processed="yes">
<h1>jQuery.LocalScroll <strong>by Ariel Flesler</strong></h1>
<div class="sidebar">
<h2 class="title">Regular Demo</h2> <div id="links">
<h3>Links</h3>
<ul>
<li><a target="_blank" href="http://plugins.jquery.com/project/LocalScroll">Project Page</a></li>
<li><a target="_blank" href="http://flesler.blogspot.com/2007/10/jquerylocalscroll-10.html">Main blog article</a></li>
<li><a target="_blank" href="http://flesler.blogspot.com/search/label/jQuery.LocalScroll">All articles</a></li>
<li><a href="http://demos.flesler.com/jquery/localScroll/ajax/">AJAX Demo</a></li>
<li><a href="http://demos.flesler.com/jquery/scrollTo/">ScrollTo Demo</a></li>
</ul>
</div>
</div>
<ul id="navigation">
<li class="sup">
<a href="#section1">Section 1</a>
<ul>
<li><a href="#section1b">Section 1-b</a></li>
<li><a href="#section1c">Section 1-c</a></li>
</ul>
</li>
<li class="sup">
<a href="#section2">Section 2</a>
<ul>
<li><a href="#section2b">Section 2-b</a></li>
<li><a href="#section2c">Section 2-c</a></li>
</ul>
</li>
<li class="sup">
<a href="#section3">Section 3</a>
<ul>
<li><a href="#section3b">Section 3-b</a></li>
<li><a href="#section3c">Section 3-c</a></li>
</ul>
</li>
<li class="sup">
<a href="#section4">Section 4</a>
<ul>
<li><a href="#section4b">Section 4-b</a></li>
<li><a href="#section4c">Section 4-c</a></li>
</ul>
</li>
<li class="sup">
<a href="#section5">Section 5</a>
<ul>
<li><a href="#section5b">Section 5-b</a></li>
<li><a href="#section5c">Section 5-c</a></li>
</ul>
</li>
</ul>
<div id="content">
<div class="section">
<ul>
<li class="sub" id="section1">
<h2>Section 1</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Suspendisse et turpis sed metus fermentum pellentesque. Vestibulum
auctor neque ac nunc elementum malesuada. Praesent non est sed libero
vestibulum consectetuer. Sed vehicula. Vivamus quis tellus sit amet erat
ultrices luctus. Fusce a ligula. Fusce viverra libero vitae velit.
Aenean bibendum nibh non lorem. Suspendisse quis velit. Integer sit amet
lacus. Curabitur tristique. Morbi eu lectus. Vestibulum tristique
aliquam quam. Sed neque.</p>
<p>Nulla facilisi. Quisque eleifend libero. Sed eros. Morbi vel
leo. Morbi varius tincidunt sem. Nam sodales volutpat velit. Suspendisse
potenti. Duis vehicula pede non nisi. Proin elit pede, ultrices non,
ultrices quis, vulputate sit amet, magna. Praesent sodales pellentesque
justo. Donec blandit, augue id convallis congue, magna libero hendrerit
erat, id blandit est lorem a tellus. Vestibulum tincidunt lectus quis
metus. Pellentesque placerat lacus in urna.</p>
<a href="#section1b" class="next">>></a>
</li>
<li class="sub" id="section1b">
<h2>Section 1-b</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Suspendisse et turpis sed metus fermentum pellentesque. Vestibulum
auctor neque ac nunc elementum malesuada. Praesent non est sed libero
vestibulum consectetuer. Sed vehicula. Vivamus quis tellus sit amet erat
ultrices luctus. Fusce a ligula. Fusce viverra libero vitae velit.
Aenean bibendum nibh non lorem. Suspendisse quis velit. Integer sit amet
lacus. Curabitur tristique. Morbi eu lectus. Vestibulum tristique
aliquam quam. Sed neque.</p>
<p>Nulla facilisi. Quisque eleifend libero. Sed eros. Morbi vel
leo. Morbi varius tincidunt sem. Nam sodales volutpat velit. Suspendisse
potenti. Duis vehicula pede non nisi. Proin elit pede, ultrices non,
ultrices quis, vulputate sit amet, magna. Praesent sodales pellentesque
justo. Donec blandit, augue id convallis congue, magna libero hendrerit
erat, id blandit est lorem a tellus. Vestibulum tincidunt lectus quis
metus. Pellentesque placerat lacus in urna.</p>
<a href="#section1" class="prev"><<</a>
<a href="#section1c" class="next">>></a>
</li>
<li class="sub" id="section1c">
<h2>Section 1-c</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Suspendisse et turpis sed metus fermentum pellentesque. Vestibulum
auctor neque ac nunc elementum malesuada. Praesent non est sed libero
vestibulum consectetuer. Sed vehicula. Vivamus quis tellus sit amet erat
ultrices luctus. Fusce a ligula. Fusce viverra libero vitae velit.
Aenean bibendum nibh non lorem. Suspendisse quis velit. Integer sit amet
lacus. Curabitur tristique. Morbi eu lectus. Vestibulum tristique
aliquam quam. Sed neque.</p>
<p>Nulla facilisi. Quisque eleifend libero. Sed eros. Morbi vel
leo. Morbi varius tincidunt sem. Nam sodales volutpat velit. Suspendisse
potenti. Duis vehicula pede non nisi. Proin elit pede, ultrices non,
ultrices quis, vulputate sit amet, magna. Praesent sodales pellentesque
justo. Donec blandit, augue id convallis congue, magna libero hendrerit
erat, id blandit est lorem a tellus. Vestibulum tincidunt lectus quis
metus. Pellentesque placerat lacus in urna.</p>
<a href="#section1b" class="prev"><<</a>
</li>
</ul>
</div>
<div class="section">
<ul>
<li class="sub" id="section2">
<h2>Section 2</h2>
<p>Nullam et sem eget massa pellentesque dapibus. Nulla
sollicitudin enim quis odio. Quisque ipsum lorem, volutpat eget,
condimentum ac, posuere id, risus. Suspendisse tortor metus, aliquet in,
varius nec, hendrerit a, libero. Suspendisse iaculis. Fusce commodo
urna ut enim. Fusce tempus eros. Phasellus sodales tellus id dolor.
Integer sollicitudin, turpis ac interdum condimentum, enim enim tempus
metus, sed imperdiet massa diam nec elit. Mauris ante augue, hendrerit
non, commodo ac, porttitor eu, turpis.</p>
<p>In fermentum nibh ut diam. Mauris sagittis, tellus ac molestie
fermentum, arcu orci pharetra mi, id vehicula massa leo vel pede. Nullam
semper tincidunt lorem. Proin arcu libero, auctor sed, interdum
egestas, ullamcorper et, lacus. Donec id lectus eget diam accumsan
ullamcorper. Donec at urna et lacus condimentum pellentesque. Phasellus
dapibus hendrerit massa. Sed sed ipsum. Quisque venenatis. Donec vel
turpis. Vivamus quis augue a turpis facilisis facilisis. Pellentesque
augue ipsum, bibendum id.</p>
<a href="#section2b" class="next">>></a>
</li>
<li class="sub" id="section2b">
<h2>Section 2-b</h2>
<p>Nullam et sem eget massa pellentesque dapibus. Nulla
sollicitudin enim quis odio. Quisque ipsum lorem, volutpat eget,
condimentum ac, posuere id, risus. Suspendisse tortor metus, aliquet in,
varius nec, hendrerit a, libero. Suspendisse iaculis. Fusce commodo
urna ut enim. Fusce tempus eros. Phasellus sodales tellus id dolor.
Integer sollicitudin, turpis ac interdum condimentum, enim enim tempus
metus, sed imperdiet massa diam nec elit. Mauris ante augue, hendrerit
non, commodo ac, porttitor eu, turpis.</p>
<p>In fermentum nibh ut diam. Mauris sagittis, tellus ac molestie
fermentum, arcu orci pharetra mi, id vehicula massa leo vel pede. Nullam
semper tincidunt lorem. Proin arcu libero, auctor sed, interdum
egestas, ullamcorper et, lacus. Donec id lectus eget diam accumsan
ullamcorper. Donec at urna et lacus condimentum pellentesque. Phasellus
dapibus hendrerit massa. Sed sed ipsum. Quisque venenatis. Donec vel
turpis. Vivamus quis augue a turpis facilisis facilisis. Pellentesque
augue ipsum, bibendum id</p>
<a href="#section2" class="prev"><<</a>
<a href="#section2c" class="next">>></a>
</li>
<li class="sub" id="section2c">
<h2>Section 2-c</h2>
<p>Nullam et sem eget massa pellentesque dapibus. Nulla
sollicitudin enim quis odio. Quisque ipsum lorem, volutpat eget,
condimentum ac, posuere id, risus. Suspendisse tortor metus, aliquet in,
varius nec, hendrerit a, libero. Suspendisse iaculis. Fusce commodo
urna ut enim. Fusce tempus eros. Phasellus sodales tellus id dolor.
Integer sollicitudin, turpis ac interdum condimentum, enim enim tempus
metus, sed imperdiet massa diam nec elit. Mauris ante augue, hendrerit
non, commodo ac, porttitor eu, turpis.</p>
<p>In fermentum nibh ut diam. Mauris sagittis, tellus ac molestie
fermentum, arcu orci pharetra mi, id vehicula massa leo vel pede. Nullam
semper tincidunt lorem. Proin arcu libero, Donec at urna et lacus
condimentum pellentesque. Phasellus dapibus hendrerit massa. Sed sed
ipsum. Quisque venenatis. Donec vel turpis. Vivamus quis augue a turpis
facilisis facilisis. Pellentesque augue ipsum, bibendum id, scelerisque
id, venenatis sit amet, nulla.</p>
<a href="#section2b" class="prev"><<</a>
</li>
</ul>
</div>
<div class="section">
<ul>
<li class="sub" id="section3">
<h2>Section 3</h2>
<p>Aliquam erat volutpat. In a neque. Mauris malesuada consectetuer
metus. Etiam molestie. Cum sociis natoque penatibus et magnis dis
parturient montes, nascetur ridiculus mus. Integer scelerisque gravida
libero. Nulla nisi massa, consequat nec, gravida sit amet, imperdiet in,
est. Nam gravida lacus. Etiam sem tortor, faucibus eget, iaculis
euismod, molestie consequat, mauris. Phasellus consectetuer lobortis
eros. Maecenas sit amet arcu. Morbi ut enim. Fusce sem augue,
consectetuer in, tempus eu, dictum vel, felis. Praesent nisl tortor,
aliquet a, fermentum ac, molestie vitae, libero.</p>
<p>Donec lacinia neque et justo. Vestibulum pretium semper tellus.
Phasellus lacinia tristique purus. Id, orci. Pellentesque habitant morbi
tristique senectus et netus et malesuada fames ac turpis egestas. Nulla
non orci eu felis accumsan blandit. Nam condimentum. Quisque pulvinar.
Cras nibh. Sed quis lorem id erat feugiat vulputate.</p>
<a href="#section3b" class="next">>></a>
</li>
<li class="sub" id="section3b">
<h2>Section 3-b</h2>
<p>Aliquam erat volutpat. Pellentesque cursus, vel dignissim dolor
est eget ante. Pellentesque a purus. Proin quis arcu ut ipsum
sollicitudin sollicitudin. In a neque. Mauris malesuada consectetuer
metus. Etiam molestie. Cum sociis natoque penatibus et magnis dis
parturient montes, nascetur ridiculus mus.Nam gravida lacus. Etiam sem
tortor, faucibus eget, iaculis euismod, molestie consequat, mauris.
Phasellus consectetuer lobortis eros. Maecenas sit amet arcu. Morbi ut
enim. Fusce sem augue, consectetuer in, tempus eu, dictum vel, felis.
Praesent nisl tortor, aliquet a, fermentum ac, molestie vitae, libero.</p>
<p>Donec lacinia neque et justo. Vestibulum pretium semper tellus.
Phasellus lacinia tristique purus. Sed magna est, auctor quis, egestas
et, tristique id, orci. Pellentesque habitant morbi tristique senectus
et netus et malesuada fames ac turpis egestas. Nulla non orci eu felis
accumsan blandit. Nam condimentum. Sed quis lorem id erat feugiat
vulputate.</p>
<a href="#section3" class="prev"><<</a>
<a href="#section3c" class="next">>></a>
</li>
<li class="sub" id="section3c">
<h2>Section 3-c</h2>
<p>Aliquam erat volutpat. Pellentesque cursus, pede vel molestie
tempor, orci mauris pellentesque mauris. Etiam molestie. Cum sociis
natoque penatibus et magnis dis parturient montes, nascetur ridiculus
mus. Integer scelerisque gravida libero. Nulla nisi massa, consequat
nec, gravida sit amet, imperdiet in, est. Nam gravida lacus. Etiam sem
tortor, faucibus eget, iaculis euismod, molestie consequat, mauris.
Phasellus consectetuer lobortis eros. Maecenas sit amet arcu. Morbi ut
enim. Fusce sem augue, consectetuer in, tempus eu, dictum vel, felis.
Praesent nisl tortor, aliquet a, fermentum ac, molestie vitae, libero.</p>
<p>Donec lacinia neque et justo. Pellentesque habitant morbi
tristique senectus et netus et malesuada fames ac turpis egestas.
ellentesque cursus, pede vel molestie tempor, orci mauris pellentesque
mauris. Nulla non orci eu felis accumsan blandit. Nam condimentum.
Quisque pulvinar. Cras nibh. Sed quis lorem id erat feugiat vulputate. </p>
<a href="#section3b" class="prev"><<</a>
</li>
</ul>
</div>
<div class="section">
<ul>
<li class="sub" id="section4">
<h2>Section 4</h2>
<p>Donec eu diam. Etiam pharetra pede id orci. Mauris tellus enim,
ultrices in, vehicula sed, feugiat eget, pede. Vestibulum odio eros,
viverra non, posuere sed, elementum blandit, nunc. Fusce sodales cursus
nibh. Nam ut sem sed tortor lacinia aliquet. Donec lacus arcu,
consectetuer non, dignissim eget, ultrices sed, ligula. Maecenas
faucibus lobortis nibh. Ut viverra justo quis felis eleifend ultrices.
Integer at magna ut lacus malesuada rutrum. Proin in odio a mi tincidunt
faucibus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Nullam nisi massa, facilisis vitae, mollis et, ornare sit amet, dolor.</p>
<p>Quisque turpis eros. Vivamus ullamcorper, diam sit amet pharetra
vehicula, sem nisi scelerisque ante, nec mattis risus augue non nulla.
Donec elit dui, porttitor eget, ultricies vel, elementum gravida, urna.
Aliquam erat volutpat. Mauris libero tellus, facilisis et, aliquet non,
pulvinar sagittis, turpis. Quisque eu augue et dui lacinia gravida. Nam
in massa a purus blandit mattis. Nulla facilisi.</p>
<a href="#section4b" class="next">>></a>
</li>
<li class="sub" id="section4b">
<h2>Section 4-b</h2>
<p>Donec eu diam. . Integer viverra ante quis nisi. Vestibulum odio
eros, viverra non, posuere sed, elementum blandit, nunc. Fusce sodales
cursus nibh. Nam ut sem sed tortor lacinia aliquet. Donec lacus arcu,
consectetuer non, dignissim eget, ultrices sed, ligula. Maecenas
faucibus lobortis nibh. Ut viverra justo quis felis eleifend ultrices.
Integer at magna ut lacus malesuada rutrum. Proin in odio a mi tincidunt
faucibus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Nullam nisi massa, facilisis vitae, mollis et, ornare sit amet, dolor.</p>
<p>Quisque turpis eros, blandit vitae, auctor vel, eleifend nec,
nisl. Nam justo lacus, elementum vel, rhoncus ut, feugiat id, ante.
Vivamus ullamcorper,Nec mattis risus augue non nulla. Donec elit dui,
porttitor eget, ultricies vel, elementum gravida, urna. Aliquam erat
volutpat. Mauris libero tellus, facilisis et, aliquet non, pulvinar
sagittis, turpis. Quisque eu augue et dui lacinia gravida. Nam in massa a
purus blandit mattis. Nulla facilisi.</p>
<a href="#section4" class="prev"><<</a>
<a href="#section4c" class="next">>></a>
</li>
<li class="sub" id="section4c">
<h2>Section 4-c</h2>
<p>Donec eu diam. Morbi molestie purus at velit. Morbi augue eros,
eleifend nec, bibendum tempor, aliquet a, augue. Integer viverra ante
quis nisi. Vestibulum odio eros, viverra non, posuere sed, elementum
blandit, nunc. Fusce sodales cursus nibh. Nam ut sem sed tortor lacinia
aliquet. Donec lacus arcu, consectetuer non, dignissim eget, ultrices
sed, ligula. Maecenas faucibus lobortis nibh. Ut viverra justo quis
felis eleifend ultrices. Integer at magna ut lacus malesuada rutrum.
Proin in odio a mi tincidunt faucibus. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Nullam nisi massa, facilisis vitae, mollis
et, ornare sit amet, dolor.</p>
<p>Quisque turpis eros, blandit vitae, auctor vel, eleifend nec,
nisl. Nec mattis risus augue non nulla. Donec elit dui, porttitor eget,
ultricies vel, elementum gravida, urna. Aliquam erat volutpat. Mauris
libero tellus, facilisis et, aliquet non, pulvinar sagittis, turpis.
Quisque eu augue et dui lacinia gravida. Nam in massa a purus blandit
mattis. Nulla facilisi.</p>
<a href="#section4b" class="prev"><<</a>
</li>
</ul>
</div>
<div class="section">
<ul>
<li class="sub" id="section5">
<h2>Section 5</h2>
<p>Fusce sit amet nibh sit amet libero pretium rutrum. Phasellus
arcu. Donec turpis lorem, eleifend ut, cursus at, lacinia eget, dolor.
Vivamus pulvinar sollicitudin ante. Nulla eu mauris sollicitudin urna
fermentum tincidunt. Mauris placerat leo ut quam. Vestibulum ante ipsum
primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed in
risus. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis
dis parturient montes, nascetur ridiculus mus. Maecenas enim.
Suspendisse odio odio, cursus ut, egestas eget, lobortis eget, magna.</p>
<p>Maecenas ultrices lectus facilisis metus. Fusce imperdiet.
Aenean bibendum magna a neque. Aenean vel tellus. Lorem ipsum dolor sit
amet, consectetuer adipiscing elit. Fusce gravida, magna non
pellentesque interdum, felis odio eleifend ligula, et luctus dolor mi et
diam. Vivamus varius nisl sed enim. Sed ultricies fermentum urna.</p>
<a href="#section5b" class="next">>></a>
</li>
<li class="sub" id="section5b">
<h2>Section 5-b</h2>
<p>Fusce sit amet nibh sit amet libero pretium rutrum. Nam iaculis
enim ac ipsum. Donec turpis lorem, eleifend ut, cursus at, lacinia eget,
dolor. Vivamus pulvinar sollicitudin ante. Nulla eu mauris sollicitudin
urna fermentum tincidunt. Mauris placerat leo ut quam. Vestibulum ante
ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
Sed in risus. Aliquam erat volutpat. Cum sociis natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Maecenas enim.
Suspendisse odio odio, cursus ut, egestas eget, lobortis eget, magna.</p>
<p>Maecenas ultrices lectus facilisis metus. Nunc nec elit vitae
lectus posuere aliquam. Integer id justo nec elit varius blandit. Aenean
vel tellus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Fusce gravida, magna non pellentesque interdum, felis odio eleifend
ligula, et luctus dolor mi et diam. Vivamus varius nisl sed enim. Sed
ultricies fermentum urna.</p>
<a href="#section5" class="prev"><<</a>
<a href="#section5c" class="next">>></a>
</li>
<li class="sub" id="section5c">
<h2>Section 5-c</h2>
<p>Fusce sit amet nibh sit amet libero pretium rutrum. Phasellus
arcu. Morbi justo purus, pellentesque ac, fringilla at, adipiscing non,
dolor. Suspendisse imperdiet lorem. Nam iaculis enim ac ipsum. Nulla eu
mauris sollicitudin urna fermentum tincidunt. Mauris placerat leo ut
quam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices
posuere cubilia Curae; Sed in risus. Aliquam erat volutpat. Cum sociis
natoque penatibus et magnis dis parturient montes, nascetur ridiculus
mus. Maecenas enim. Suspendisse odio odio, cursus ut, egestas eget,
lobortis eget, magna.</p>
<p>Maecenas ultrices lectus facilisis metus. Nunc nec elit vitae
lectus posuere aliquam. Integer id justo nec elit varius blandit. Aenean
vel tellus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Fusce gravida, magna non pellentesque interdum, felis odio eleifend
ligula, et luctus dolor mi et diam. Vivamus varius nisl sed enim. Sed
ultricies fermentum urna.</p>
<a href="#section5b" class="prev"><<</a>
</li>
</ul>
</div>
</div>
<div id="da-slider" class="da-slider">
<div class="da-slide">
<h2 class="margin">Grafica</h2>
<p class="margin"></p>
<div class="da-img"><img src="http://img1.fotoalbum.virgilio.it/v/www1-2/176/176513/304872/IMG_0898-vi.jpg"/></div>
</div><!--div id="da-slider" class="da-slider"-->
<div class="da-slide">
<h2 class="margin">Web</h2>
<p class="margin_h2"></p>
<div class="da-img"><img src="http://upload.wikimedia.org/wikipedia/commons/c/c6/Great_spotted_Eagle_I_IMG_8362.jpg"/></div>
</div>
<div class="da-slide">
<h2 class="margin">Media</h2>
<p class="margin_h2"></p>
<div class="da-img"><img src="http://img2.fotoalbum.virgilio.it/v/www1-3/176/176513/304872/IMG_0880-vi.jpg"/></div>
</div>
<nav class="da-arrows">
<span class="da-arrows-prev"></span>
<span class="da-arrows-next"></span>
</nav>
</div>
<script type="text/javascript">
$(function() {
$('#da-slider').cslider({
autoplay : true,
bgincrement : 450
});
});
</script>
</body>
</html>
お役に立てれば。よろしく