JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/jmar777/kwicks/v2.0.0/jquery.kwicks.js"></script>
<div id="slider">
    <div class="inner">
        <ul style="width:960px; height:400px; margin:15px 0;" data-width="960" data-max="660" class="kwicks" id="kwicks-1">
            <li class="kwicks-selected" style="left: 0px; width: 192px; margin: 0px; position: absolute;">
                <div class="kw_shadow"></div>
                <div class="kw_img">
                    <img width="960" height="400" alt="" src="http://silverharmony.in/wp-content/themes/cstardesign/cache/timthumb.php?src=http://silverharmony.in/wp-content/uploads/2012/10/2.jpg&amp;h=400&amp;w=960&amp;zc=1&amp;q=100">
                </div>
            </li>
            <li class="kwick" style="left: 192px; width: 192px; margin: 0px; position: absolute;">
                <div class="kw_shadow"></div>
                <div class="kw_img">
                    <img width="960" height="400" alt="" src="http://silverharmony.in/wp-content/themes/cstardesign/cache/timthumb.php?src=http://silverharmony.in/wp-content/uploads/2012/10/Image-2.jpg&amp;h=400&amp;w=960&amp;zc=1&amp;q=100">
                </div>
            </li>
            <li class="kwick" style="left: 384px; width: 192px; margin: 0px; position: absolute;">
            <div class="kw_shadow"></div>
            <div class="kw_img">
                    <img width="960" height="400" alt="" src="http://silverharmony.in/wp-content/themes/cstardesign/cache/timthumb.php?src=http://silverharmony.in/wp-content/uploads/2012/10/3.png&amp;h=400&amp;w=960&amp;zc=1&amp;q=100">
                </div>
            </li>
            <li class="kwick" style="left: 576px; width: 192px; margin: 0px; position: absolute;">
            <div class="kw_shadow"></div>
            <div class="kw_img">
                    <img width="960" height="400" alt=""...

CSS

.kwicks {
    display: block;
    list-style-type: none;
    list-style: none;
    position: relative;
    margin: 0;
    padding: 0;
    
}
.kwicks > * {
    display: block;
    overflow: hidden;
    padding: 0;
    margin: 0;
}
.kwicks.kwicks-processed > * {
    margin: 0;
    position: absolute;
}
.kwicks-horizontal > * {
    float: left;
}
.kwicks-horizontal > :first-child {
    margin-left: 0;
}
.kwicks-vertical > :first-child {
    margin-top: 0;
}


#slider {
    background-attachment: scroll;
    background-color: #FFFFFF;
    background-image: url("http://silverharmony.in/wp-content/uploads/2012/10/Slider_bg.png");
    background-position: 50% 0;
    background-repeat: repeat;
    display: block;
    float: left;
    width: 100%;
}
.inner, .wrapper {
    display: block;
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 960px;
    z-index: 0;
}

ul.kwicks {
    background-color: #333333;
    border-radius: 3px 3px 3px 3px;
    list-style: none outside none;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
}

ul.kwicks li {
    background: url("http://silverharmony.in/wp-content/themes/cstardesign/images/icons/ajax_loader.gif") no-repeat scroll 50% 50% transparent;
    display: block;
    overflow: hidden;
    padding: 0;
}

.kw_img {
    display: block;
}
.kw_img img {
    vertical-align: middle;
}
.kw_shadow {
    background: url("http://silverharmony.in/wp-content/themes/cstardesign/images/icons/overlay.png") repeat-y scroll 0 0 transparent;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
    height: 100%;
    position: absolute;
    right: 0;
    width: 40px;
    z-index: 2;
}

JavaScript

$(function() {
    $('.kwicks').kwicks({
        size: 125,
        maxSize : 250,
        spacing : 0,
 
        });
});