/* == Slider JS == */

jQuery(document).ready(function() {
    jQuery('#slider').after('<div class="caption"></div>');
    jQuery('.caption').after('<div id="slider-bullets"></div>');
    jQuery('#slider-bullets').after('<a id="prev-slide" href="#"><span>Prev</span></a><a id="next-slide" href="#"><span>Next</span></a>');
    jQuery('#slider-container').hover(function() {
        jQuery('#prev-slide').fadeIn(400);
        jQuery('#next-slide').fadeIn(400);
    }, function() {
        jQuery('#prev-slide').fadeOut(400);
        jQuery('#next-slide').fadeOut(400);
    });
    
    var temptitle;
    jQuery('.slide-item').hover(function() {
        temptitle = jQuery(this).attr("title");
        jQuery(this).attr("title","");
    }, function() {
        jQuery(this).attr("title",temptitle);
    });
});

function onAfter() {
    jQuery('.caption').html(this.title);
    if(jQuery.trim(this.title) != "")
        jQuery('.caption').fadeIn(500);
}

function onBefore() {
    jQuery('.caption').fadeOut(300);
}