If you take a look at [the fiddle](http://jsfiddle.net/dRyGL/) you'll know what I am talking about. I'm trying to create the effect that when the user hovers over one of the images, he gets that remove bar sliding down from the image.   
 Problem is, when I hover over an image, the other images jump down from some strange reason.   

HTML:

```
<div class="show">
    <a href="#">
        <img alt="Pic1" class="thumbnail" />
    </a>
    <div class="remove-bar">
        <a href="#">r </a>
    </div>
</div>
<div class="show">
    <a href="#">
        <img alt="Pic2" class="thumbnail" />
    </a>
    <div class="remove-bar">
        <a href="#"> r</a>
    </div>
</div>
<div class="show">
    <a href="#">
        <img alt="Pic3" class="thumbnail" />
    </a>
    <div class="remove-bar">
        <a href="#">r</a>
    </div>
</div>

```

CSS:

```
.show {
  display: inline-block;
}
.thumbnail {
  width: 12.5em;
  height: 18.750em;
  margin: 1em;
  margin-bottom: 0;
  cursor: pointer;
  box-shadow: 0 1px 2px lighten(#333, 30%);
}
.remove-bar {
  text-align: right;
  width: 11.9em ;
  margin-top: 0;
  margin-left: 1em;
  background-color: blue;
  padding: 5px;
    } .remove-bar a {
    color: white;
}

```

JS:

```
$('.remove-bar').hide();
$('.show a').hover(function() {
    $(this).next('div.remove-bar').slideDown(100);
}, function() {
    $(this).next('div.remove-bar').slideUp(100);
});

```

Also, notice that when you hover over an image and try to click 'r', you can't because it quickly disappears. **Thanks a lot!**