jQuery Einzeiler macht Inhaltsabfrage WebPart zu Newsticker

Man muss jQuery einfach lieben! Ich habe gerade eine Möglichkeit gefunden, ganz einfach aus einem Inhaltsabfrage Webpart (Content By Query Web Part) in SharePoint 2010 einen Newsticker zu bauen. Der tatsächliche Code ist dabei ein Einzeiler!

setInterval(function(){
    $('.dfwp-list li:first').slideUp(function () {
        $(this).appendTo($('.dfwp-list')).slideDown(); }); }, 5000);

Ganz einfaches Vorgehen: Inhaltsabfrage Webpart auf Seite einbinden und konfigurieren, so dass alle gewünschten Einträge angezeigt werden. Neuen Inhaltseditor Webpart auf die Seite einbinden und „HTML Quelle bearbeiten“, dort folgenden Code einfügen:

<script src="link zu jquery" type="text/javascript">
</script>
<style type="text/css">
    .dfwp-list {
        height: 90px;
        overflow: hidden;
        border: 1px solid gray;
    }
    .dfwp-list li {
        display: block;
        border-bottom: 1px dotted gray;
        height: 30px;
    }
</style>
<script type="text/javascript">
    setInterval(function(){
        $('.dfwp-list li:first').slideUp( function () {
            $(this).appendTo($('.dfwp-list')).slideDown();
        });
    }, 5000);
</script>

Fertig. Danach kann man noch nach Belieben verfeinern (z.B. zeigt der Ticker so 3 Nachrichten gleichzeitig an, da er eine Höhe von 90 Pixeln hat und die Nachrichten 30 Pixeln hoch sind).