48 lines
1.6 KiB
HTML
48 lines
1.6 KiB
HTML
<!DOCTYPE html>
|
|
<head>
|
|
<title>Nivoo Slider Demo</title>
|
|
<link rel="stylesheet" type="text/css" href="NivooSlider.css" />
|
|
<link rel="stylesheet" type="text/css" href="demo.css" />
|
|
<script type="text/javascript" src="mootools-core-1.4.5-full-nocompat-yc.js"></script>
|
|
<script type="text/javascript" src="../Source/NivooSlider.js"></script>
|
|
<script type="text/javascript">
|
|
window.addEvent('domready', function () {
|
|
// Click event for demo only
|
|
$$('a')[1].addEvent('click', function(e){
|
|
e.stop();
|
|
alert('[you triggered a click event]');
|
|
});
|
|
// initialize Nivoo-Slider
|
|
new NivooSlider($('Slider'), {
|
|
directionNavPosition: 'outside',
|
|
effect: 'random',
|
|
interval: 5000,
|
|
orientation: 'random'
|
|
});
|
|
});
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<div id="Wrapper">
|
|
|
|
<h1>Nivoo Slider Demo</h1>
|
|
|
|
<div id="Slider" class="nivoo-slider">
|
|
<a href="#">
|
|
<img src="images/1269388.jpg" alt="useful alt text" title="This is an example of a linked image" height="350" width="600" />
|
|
</a>
|
|
<img src="images/1268244.jpg" alt="useful alt text" title="This is an example of a caption" height="350" width="600" />
|
|
<a href="#">
|
|
<img src="images/1270048.jpg" alt="useful alt text" title="Click on the image to trigger the click event" height="350" width="600" />
|
|
</a>
|
|
<img src="images/1270256.jpg" alt="useful alt text" height="350" width="600" />
|
|
</div>
|
|
|
|
<p>For the documentation go to the <a href="https://github.com/JohannesFischer/Nivoo-Slider">Nivoo Slider github page</a>.</p>
|
|
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|