ilch.de :: Forum :: Allgemein :: HTML, PHP, SQL,...

ilch Forum » Allgemein » HTML, PHP, SQL,... » scrolltext

Gehe zu Seite:

Geschlossen

Do. 30.04.2009 11:38 Uhr #1

Son!c Hall Of Fame

hi zusammen

ich möchte gerne, dass mein scrolltext unendlich lang durchläuft - sprich das er nicht ganz durchlaufen muss bis er wieder anfängt, sozusagen dass er sich immer automatisch wiederholt.

allerdings weiß ich nicht wie ich das mit JS zumsetzten kann, hoffe ihr könnt mir da helfen lächeln

gruß
sonic

Nimm das Leben nicht zu ernst, du kommst sowieso nicht lebend raus.

0 Mitglieder finden den Beitrag gut.

zitieren

Do. 30.04.2009 12:17 Uhr #2

Mairu Coder

Wir hatten ja schonmal drüber gesprochen, soll es wirklich nur ein Text sein, oder ist er ggf. mit HTML formatiert?

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite

0 Mitglieder finden den Beitrag gut.

zitieren

Do. 30.04.2009 13:10 Uhr #3

Son!c Hall Of Fame

also der scolltext besteht aus links und bildern

Nimm das Leben nicht zu ernst, du kommst sowieso nicht lebend raus.

0 Mitglieder finden den Beitrag gut.

zitieren

Do. 30.04.2009 15:57 Uhr #4

Mairu Coder

Naja wenn es genügen Elemente enthält könnte es vielleicht gehen, aber nicht, wenn ein Element vorn und hinten gleichzeitig angezeigt werden soll, bzw. dann ist es noch verzwickter.

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite

0 Mitglieder finden den Beitrag gut.

zitieren

Do. 30.04.2009 16:48 Uhr #5

Son!c Hall Of Fame

was meinst du mit elemente?

Nimm das Leben nicht zu ernst, du kommst sowieso nicht lebend raus.

0 Mitglieder finden den Beitrag gut.

zitieren

Do. 30.04.2009 17:23 Uhr #6

Mairu Coder

Naja halt Bilder oder Links, ich nehme ja mal an, dass es verlinkte Bilder sind.

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite

0 Mitglieder finden den Beitrag gut.

zitieren

Do. 30.04.2009 17:47 Uhr #7

Son!c Hall Of Fame

richtig ^^

Nimm das Leben nicht zu ernst, du kommst sowieso nicht lebend raus.

0 Mitglieder finden den Beitrag gut.

zitieren

Fr. 01.05.2009 10:15 Uhr #8

Mairu Coder

Hast du schon ein JS-Framework im Einsatz, also sowas wie mootools, jquery etc. ?

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite

0 Mitglieder finden den Beitrag gut.

zitieren

Fr. 01.05.2009 11:08 Uhr #9

Son!c Hall Of Fame

eh ... nich das ich wüsste

Nimm das Leben nicht zu ernst, du kommst sowieso nicht lebend raus.

0 Mitglieder finden den Beitrag gut.

zitieren

Fr. 01.05.2009 14:05 Uhr #10

Mairu Coder

So hab mich mal dran versucht und es geht auch soweit, hier mal meine Testseite.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>Moo Test</title>
        <script src="mootools-1.2.2-core.js"></script>
        <style>
            body { background-color: #80ffff; }
            #mScroller {
                width: 200px;
                overflow: hidden;           
            }
            #mScroller a {
                float: left;
                padding: 0 5px;
            }
            #mScroller img {
                border: 0px;
            }
        </style>
        <script>
            var mScroller = new Class({
                root : null,
                links : [],
                firstA : 0,
                initialize : function(elid) {
                    this.root = $(elid);
                    this.links = $$('#mScroller a');
                    this.iDiv = this.root.getFirst('div');
                    this.iDiv.setStyle('width',  this.getImgWidthSum());
                    this.start();
                },
                getImgWidthSum : function () {
                    var width = 0;
                    this.links.each(function(item, index) {
                        width += item.getSize().x;
                    });
                    return width;
                },
                scroll : function() {
                    var pos = this.root.getScroll();
                    var fA = this.links[this.firstA];
                    var fAsize = fA.getSize().x;
                    if (pos.x > fAsize) {
                        this.iDiv.grab(fA);
                        pos.x -= fAsize;
                        if (this.firstA == this.links.length - 1) {
                            this.firstA = 0;
                        } else {
                            this.firstA++;
                        }
                    }
                    this.root.scrollTo(pos.x + 15, pos.y);
                },
                stop : function () {
                    $clear(this.per);
                },
                start : function () {
                    this.per = this.scroll.periodical(200, this);
                }
            });
            window.addEvent('domready', function () {
                myScroller = new mScroller('mScroller')
                $('mScroller').addEvents({
                    'mouseover': function(){
                        myScroller.stop();
                    },
                    'mouseout': function () {
                        myScroller.start();
                    }
                     
                });
            });
        </script>
    </head>
    <body>
        <h1>Testen halt</h1>
        <div id="mScroller">
            <div>
            <a href="www.ilch.de"><img src="http://www.ilch.de/images/banner/kilch.jpg"></a>
            <a href="www.ilch.de"><img src="http://www.ilch.de/images/banner/copy_by_ilch.gif"></a>
            <a href="www.ilch.de"><img src="http://www.ilch.de/images/banner/kleiner_banner.gif"></a>
            <a href="www.ilch.de"><img src="http://www.ilch.de/images/banner/nkilch.gif"></a>
            </div>
        </div>
        <a href="javascript:myScroller.stop();">stop</a>
    </body>
</html>

MooTools bekommst du von mootools.net/

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite

0 Mitglieder finden den Beitrag gut.

zitieren

Beitrag zur Merkliste hinzufügen

ilch Forum » Allgemein » HTML, PHP, SQL,... » scrolltext