diff -rupN a/slider.js b/slider.js
--- a/slider.js	2011-11-09 05:43:58.000000000 -0500
+++ b/slider.js	2011-11-25 12:14:22.000000000 -0500
@@ -1,50 +1,70 @@
-(function ($) {
-
-Drupal.behaviors.slider = {
-    attach:function(context) {
-        
-      var maxWidth = Drupal.settings.views_horizontal_slider.max_width;
-      var minWidth = Drupal.settings.views_horizontal_slider.min_width;
-      var caption_field = Drupal.settings.views_horizontal_slider.caption_field_name;
-
-      /* the animations are saved as strings via fapi, but somehow duration explicitly wants an int*/
-      var caption_fadein = parseInt(Drupal.settings.views_horizontal_slider.caption_field_fadeout);
-      var caption_fadeout = parseInt(Drupal.settings.views_horizontal_slider.caption_field_fadein);
-        
-      var lastBlock = $('.views_horizontal_slider div.item-list li.hslider-active');
-
-      /* the animations are saved as strings via fapi, but somehow duration explicitly wants an int*/
-      var animate_in = parseInt(Drupal.settings.views_horizontal_slider.animate_in);
-      var animate_out = parseInt(Drupal.settings.views_horizontal_slider.animate_out);
-
-      $('.views_horizontal_slider div.item-list li').hover(
-        function(){
-          $(lastBlock).animate({width: minWidth+'px'}, { queue:false, duration:animate_in});
-          $(this).animate({width: maxWidth+'px'}, { queue:false, duration:animate_out});
-
-              if(caption_field) {
-                  $(this).children('.'+caption_field).fadeIn(caption_fadein);
-              }
-              else {}
-
-          lastBlock = this;
-        },
-        function(){
-
-            if(caption_field) {
-                $(lastBlock).children('.'+caption_field).fadeOut(caption_fadeout);
-            }
-            else {}
-
-        }
-      );
-
-    }
-
-};
-
-
-}(jQuery));
-
-
-
+(function ($) {
+
+Drupal.behaviors.slider = {
+    attach:function(context) {
+        
+      var maxWidth = Drupal.settings.views_horizontal_slider.max_width;
+      var minWidth = Drupal.settings.views_horizontal_slider.min_width;
+      var caption_field = Drupal.settings.views_horizontal_slider.caption_field_name;
+
+      /* the animations are saved as strings via fapi, but somehow duration explicitly wants an int*/
+      var caption_fadein = parseInt(Drupal.settings.views_horizontal_slider.caption_field_fadeout);
+      var caption_fadeout = parseInt(Drupal.settings.views_horizontal_slider.caption_field_fadein);
+        
+      var lastBlock = $('.views_horizontal_slider div.item-list li.active');
+      var nonPreBlock = $('.views_horizontal_slider div.item-list li');
+
+      /* the animations are saved as strings via fapi, but somehow duration explicitly wants an int*/
+      var animate_in = parseInt(Drupal.settings.views_horizontal_slider.animate_in);
+      var animate_out = parseInt(Drupal.settings.views_horizontal_slider.animate_out);
+      
+      /*intiate start according to user definition*/
+      
+      $(document).ready(function(){
+             if(caption_field) {
+                  /*hide closed-items caption field*/
+                  $(nonPreBlock).children('.'+caption_field).fadeToggle(0);
+                  /*show pre-opend-items caption field*/
+                  $(lastBlock).children('.'+caption_field).fadeToggle(0);
+                  /*sets width for non pre-opend-item*/
+                  $(nonPreBlock).width(minWidth);
+                  /*set width and class for pre-opend-item*/
+                  $(lastBlock).width(maxWidth);
+              }
+              else {}
+      });
+      
+      $('.views_horizontal_slider div.item-list li').hover(
+        function(){
+          $(lastBlock).animate({width: minWidth+'px'}, { queue:false, duration:animate_in});
+          $(this).animate({width: maxWidth+'px'}, { queue:false, duration:animate_out});
+
+              if(caption_field) {
+                  /*prevent animation if status of hoverd item is aktive*/
+                  checkClass = $(this).hasClass('active');
+                  if(checkClass==false) {
+                  $(lastBlock).children('.'+caption_field).fadeOut(caption_fadein).queue(false);
+                  $(this).children('.'+caption_field).fadeIn(caption_fadeout).queue(false);
+                  }
+              }
+              else {}
+          /*setting 'aktive' Class*/
+          $(lastBlock).removeClass('active');
+          $(this).addClass('active');
+          lastBlock = this;
+        },
+        function(){
+
+
+        }
+      );
+
+    }
+
+};
+
+
+}(jQuery));
+
+
+
diff -rupN a/views-horizontal-slider-view.tpl.php b/views-horizontal-slider-view.tpl.php
--- a/views-horizontal-slider-view.tpl.php	2011-11-09 05:43:58.000000000 -0500
+++ b/views-horizontal-slider-view.tpl.php	2011-11-25 12:15:05.000000000 -0500
@@ -25,13 +25,13 @@
 
 
       <?php if ( ($id == 0) &&  ( $id == (($variables['options']['activated_item'])-1) )): ?>
-       <li class="<?php print "hslider-first hslider-active"; ?>"><?php print $row; ?></li>
+       <li class="<?php print "hslider-first active"; ?>"><?php print $row; ?></li>
 
       <?php elseif ($id == 0): ?>
        <li class="<?php print "hslider-first"; ?>"><?php print $row; ?></li>
 
      <?php elseif ( $id == (($variables['options']['activated_item'])-1) ): ?>
-      <li class="<?php print "hslider-active"; ?>"><?php print $row; ?></li>
+      <li class="<?php print "active"; ?>"><?php print $row; ?></li>
 
       <?php elseif ($id == (count($rows)-1) ): ?>
        <li class="<?php print "hslider-last"; ?>"><?php print $row; ?></li>
diff -rupN a/views_horizontal_slider.css b/views_horizontal_slider.css
--- a/views_horizontal_slider.css	2011-11-09 05:43:58.000000000 -0500
+++ b/views_horizontal_slider.css	2011-11-25 09:36:00.000000000 -0500
@@ -9,8 +9,10 @@ div.views_horizontal_slider div.item-lis
   font-family: Arial, sans-serif;
   font-size: 11px;
   margin: 0;
-  padding: 0;
-  width:940px;
+  padding: 0;
+  /* It can't see the reason for this limitation
+  width:940px;
+  */
 }
 
 div.views_horizontal_slider div.item-list li{
@@ -18,8 +20,9 @@ div.views_horizontal_slider div.item-lis
   padding: 0px;
   display: block;
   margin-right: 2px;
-  color: #7c7c7c;
-  width: 100px; /* Initial width. This should be the same witdh as the "Min width" in the views options */
+  color: #7c7c7c;
+  /* this part is not needed any more
+  width: 100px;  Initial width. This should be the same witdh as the "Min width" in the views options */
   cursor: pointer; 
   overflow:hidden;
   position:relative; /* fix for ie7 relative positioning of children*/
@@ -33,20 +36,21 @@ div.views_horizontal_slider div.item-lis
 div.views_horizontal_slider div.item-list li img{
   z-index:100;
 }
-
-/* This is the style for the active item on page load */
+
+/* this part is not needed any more
+ This is the style for the active item on page load 
 div.views_horizontal_slider div.item-list li.hslider-active{
   width: 300px; 
 }
 
 
 
-/******************************************
+******************************************
 ********* HOVER TEXT STYLES ***************
-******************************************/
+******************************************
 
-/* this needs to be styled individually because one may use other fields*/
-/* this is a sample with the TITLE field and and image, the views fields ar sorted title first then image to avoid z-index issues*/
+* this needs to be styled individually because one may use other fields*
+* this is a sample with the TITLE field and and image, the views fields ar sorted title first then image to avoid z-index issues*
 
 div.views_horizontal_slider div.item-list li .views-field-title {
   z-index: 999;
@@ -56,7 +60,7 @@ div.views_horizontal_slider div.item-lis
   background-color: #fff;
   margin-left:20px;
   padding: 3px 10px 3px 10px;
-  /*display:none; */
+  *display:none; *
   width:200px;
 }
-
+*/