Frame mit fade out inhalt ändern.

ciberjoerg

Erfahrenes Mitglied
Auf der seite http://www.fear.fm/radio/top40 gibt es 3 Buttons mit Jump/Tek, Harder und Hardcore.

Jetzt aber die Frage: Wie mach ich so nen Seitenübergang mit fadeOut.

Kurzer Codeausschnitt der seite.

PHP:
<script type="text/javascript">
function showTop40(iKey){
    if($("#top40container_hard").is(':visible')){
        var sKey = 'hard';
    }
    if($("#top40container_harder").is(':visible')){
        var sKey = 'harder';
    }
    if($("#top40container_hardest").is(':visible')){
        var sKey = 'hardest';
    }
    $('#top40container_'+sKey).fadeOut('fast',function(){
		$('#top40container_'+sKey).removeClass("active");
        setupPaginatorUrls(iKey);
        $('#top40container_'+iKey).fadeIn('fast', function(){
            $('#top40container_'+iKey).addClass("active");
        });
    });
}
function addRelease() {
    $.fancybox(
        $("#addrelease_container").html(),
        {
            'autoDimensions'    : false,
            'width'             : 300,
            'height'            : 75,
            'transitionIn'        : 'none',
            'transitionOut'        : 'none',
            'overlayOpacity'    : 0.4
        }
    );
}
function setupPaginatorUrls(sValue){
    if($('#top40-prev-url').length > 0){
        var aUrl = $('#top40-prev-url').attr('href').split('#');
        $('#top40-prev-url').attr('href', aUrl[0]+'#'+sValue);
    }
    if($('#top40-next-url').length > 0){
        var aUrl = $('#top40-next-url').attr('href').split('#');
        $('#top40-next-url').attr('href', aUrl[0]+'#'+sValue);
    }
}
function initCurrentChart(sTheme){
    var arr = window.location.href.split('#');
    if(arr[1] == undefined){
        var sValue = sTheme;
        
    }
    else{
        var sValue = arr[1];
        
    }
    $('#top40container_'+sValue).slideDown('fast');
    setupPaginatorUrls(sValue);
}
initCurrentChart('harder');
</script>

PHP:
<a href="#hard" onclick="showTop40('hard');" class="button-hard"><span>Jump / Tek</span></a><a href="#harder" onclick="showTop40('harder');" class="button-harder"><span>Hardstyle</span></a><a href="#hardest" onclick="showTop40('hardest');" class="button-hardest"><span>Hardcore</span></a>

Wäre das alles oder muss da noch irgendwas angepasst werden? Bzw wie Könnte ich eine website Komplett mit solch einem script Schreiben?
 
Zurück