Slide div left from specific position

by eventide

HTML

<table>
    <tr>
        <td>Lorem ipsum dolor sit amet, consectetur adipisicing elit</td>
    </tr>
    <tr>
        <td>Some other stuff</td>
    </tr>
    <tr>
        <td>
            <label class="lblViewTdmStatus">View Status</label>
        </td>
    </tr>
</table>
<div class="hidden flyout">
    <img id="someimage" />Some text and other stuff</div>

CSS

table { background-color: #CCCCCC;}
.hidden {

    display: none;

}

.flyout {

    width: 560px;

    height: 56px;

    background-color: #EFF7DF;

    padding: 10px;

    margin: 0;

    border-radius: 10px;

    border: solid 1px #CC6600;

    position: fixed;

    overflow: hidden;

    z-index: 10000;

    top: 100px;

    right: 100px;

}

JavaScript

$('.lblViewStatus').hover(function () {
    $('.flyout').toggle("slide", {
        direction: 'left'
    });
    alert('hover');
});