jQuery Slider

jQuery Slider

Hello,

I am working at a mobile Homepage. I attached the total Code.

I have tried the Excolo Slider ( http://excolo.github.io/Excolo-Slider/)

The pictures are shown, but the function is written below the pictures and not working.

$(function () {
    $("#slider").excoloSlider();
});

Code:
<!DOCTYPE html>
<html lang="de">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="xxx" content="index, follow">
<meta name="Description" content="xxx">
<meta name="Keywords" content="xxx">
<title>xxx</title>


<link rel="stylesheet" href=" http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src=" http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src=" http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>ยด

<script src="javascripts/jquery-1.9.1.min.js"></script>
<script src="javascripts/jquery.excoloSlider.min.js"></script>
<link href="stylesheets/jquery.excoloSlider.css" rel="stylesheet">

<style>
  a#meinlink:hover {color:white;}
</style>
</head>

<body>

<div data-role="page">

<!-- Header -->
<div data-role="header">
<h1>JvP GmbH</h1>
</div><!-- /header -->

<!-- Content -->
<div data-role="content">

<!-- Accordion -->
<div data-role="collapsible-set" data-content-theme="c">

<!-- Tab 1 Home -->
<div data-role="collapsible" data-theme="b" data-content-theme="b" data-collapsed="false">
<h3>Home</h3>

<center>
<p><span style="color:blue"><b>xxx</b></span></p>
</center>
<br>

$(function () {
    $("#slider").excoloSlider();
});

<div id="slider">
    <img src="images/image1.jpg">
    <img src="images/image2.jpg">
    <img src="images/image3.jpg">
    <img src="images/image4.jpg" data-plugin-slide-caption="I am a caption <b>and I can contain HTML.</b>">
    <img src="images/image5.jpg">
    <img src="images/image6.jpg">
    <img src="images/image7.jpg">
    <img src="images/image8.jpg">
</div>