This page requires a Javascript enabled browser
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!-- DC Media Slider CSS --> 
<link rel="stylesheet" type="text/css" media="all" href="dcodes/sliders/media-slider/css/jquery.mediaslider.0.3.css" />
<!-- DC Javascript Library -->
<script type="text/javascript" src="dcodes/jquery.min.js"></script> <!-- jQuery Library (do not call twice on same page) -->
<script type="text/javascript" src="dcodes/jquery.easing.js"></script> <!-- jQuery Easing (do not call twice on same page) -->
<!-- DC Media Slider JS -->
<script src="dcodes/sliders/media-slider/js/jquery.timers-1.2.js" type="text/javascript"></script>
<script src="dcodes/sliders/media-slider/js/jquery.mediaslider.0.3.min.js" type="text/javascript"></script>
<!-- DC Media Slider Settings -->
<script type="text/javascript">
         
        $(document).ready(function() {
             
            $(".media-carousel").dualSlider({
                auto:true, // auto play slides
                autoDelay: 4000, // time before next slide (4000 = 4 seconds)
                easingCarousel: "swing", // slide effect
                easingDetails: "easeOutBack",
                durationCarousel: 800,
                durationDetails: 500
            });
             
        });
</script>
<!-- DC Media Slider Start -->
<div style="width:980px; margin:0 auto; padding:10px; position:relative;"> <!-- define slider container width (strict enforce) -->
<div class="media-carousel clearfix">
    <div class="panel">
        <div class="details_wrapper">
             
            <div class="details">
             
                <!-- Slide 1 -->
                <div class="detail">
                    <h2><a href="#">Media Slider</a> supports:</h2> YouTube, Vimeo, Flash, Images, Inline Content & more!<br /><br />
                    <a href="#" title="Read more" class="more">Read more</a>
                </div>
                 
                <!-- Slide 2 -->
                <div class="detail">
                    <h2><a href="#">Vimeo</a> Supported.</h2> This caption is completely customizable.<br /><br />
                    <a href="#" title="Read more" class="more">Read more</a>
                </div>
                 
                <!-- Slide 3 -->
                <div class="detail">
                    <h2><a href="#">YouTube</a>: Supported.</h2> Embed videos in seconds!<br /><br />
                    <a href="#" title="Read more" class="more">Read more</a>
                </div>
             
            </div><!-- /details -->
             
        </div><!-- /details_wrapper -->
         
        <div class="paging">
            <div id="numbers"></div>
            <a href="javascript:void(0);" class="previous" title="Previous" >Previous</a>
            <a href="javascript:void(0);" class="next" title="Next">Next</a>
        </div><!-- /paging -->
         
        <a href="javascript:void(0);" class="play" title="Turn on autoplay">Play</a>
        <a href="javascript:void(0);" class="pause" title="Turn off autoplay">Pause</a>
         
    </div><!-- /panel -->
    <div class="backgrounds">
         
        <div class="item item_1">
        <img src="dcodes/sliders/media-slider/images/banner1.jpg" width="704" height="341" />
            </div><!-- /item -->
         
        <div class="item item_2">
            <iframe src="http://player.vimeo.com/video/4749536?color=ffffff" width="704" height="340" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
        </div><!-- /item -->
         
        <div class="item item_3">
            <iframe width="704" height="340" src="http://www.youtube.com/embed/FG0fTKAqZ5g?rel=0" frameborder="0" allowfullscreen></iframe>        
        </div><!-- /item -->
         
    </div><!-- /backgrounds -->
</div> <!-- /media-carousel -->
</div>       
<!-- DC Media Slider Ends -->
<div class="dc_clear"></div> <!-- line break/clear line -->