Ergebnis 1 bis 2 von 2
  1. #1
    henscho ist offline Grünschnabel
    registriert
    17-03-2008
    Beiträge
    6

    DIV Element mit eigener Scrollfunktion aktivieren?

    Hi!
    Ich habe ein kleines Problem mit einem Javascript.... Ich möchte ein DIV Element mit "display:none" nach "display:block" aktivieren (per Link). In dem aktivierten Element soll sich ein scrollbares DIV Element befinden. Und das funktioniert leider nicht. Man kann nicht scrollen.
    Ich denke es liegt daran, dass das DIV Element im "none" Status am Anfang, bevor der Link "projekt" gedrückt wird, schlicht nicht exsistiert ??

    Hat jemand einen Tipp für mich? "display:hidden" möchte ich ungerne benutzen...

    Vielen Dank für jede Hilfe!! Gruß


    Hier der Code:

    HTML-Code:
    <html>
    
    <head>
    <style type="text/css">
    	
    #content {
    clip: rect(0 100px 60px 0);
    width: 100px;
    position: absolute;
    }
    .scroller {
    float: right;
    width: 10px;
    }
    .scroller .arrow {
    border: 1px solid black;
    cursor: pointer;
    padding: 4px;
    }
    .scroller .bar {
    height: 50px;
    margin: 2px;
    border: 1px solid black;
    padding: 0 2px;
    }
    </style>
    
    
    <script language="Javascript">
    
    var actualSite ="home";
    function on (site){
    var grabedSite=document.getElementById(site);
    grabedSite.style.display="block";
    }
    </script>
    
    </head>
    <body>
    
    
    <div id="projekte"  style="display:none;">
    
    <div class="scroller" style="position:relative; height:300px;width:220px;background-color:#00FF00;float:left;">
    test
    <p class="arrow" onmouseover="scroll.start(-10)" onmouseout="scroll.stop()" title="Nach oben"></p>
    <p class="bar"></p>
    <p class="arrow" onmouseover="scroll.start(10)" onmouseout="scroll.stop()" title="Nach unten"></p>
    
    </div>
    <div id="content" style="background-color:#3333FF;">
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    test
    tes
    ende
    </div>
    
    <div id="three" style="position:relative; height:300px;width:337px;background-color:#CCFF66;float:right;">
    </div>
    <div style="clear:both;"></div>
    </div>
    
    <script src="scroll.class.js" type="text/javascript"></script>
    <script type="text/javascript">
    var scroll = new SCROLL(
    document.getElementById('content'),
    {
    'time': 60,
    'width': 300,
    'height': 60
    }
    );
    </script>
    
    <span id="projekt_menu" class="menu"><a href="javascript:on('projekte')"> projekte </a></span>
    </body>
    
    </html>
    Und der Code der scroll.class.js:

    Code:
    SCROLL = function(obj, attr) {
    var interval;
    var offset = {
    'top': obj.offsetTop || 0,
    'height': obj.offsetHeight || 0
    };
    this.start = function(amount) {
    /* Default setzen */
    attr.top = attr.top || 0;
    attr.width = attr.width || "auto";
    attr.height = attr.height || "auto";
    /* Intervall starten */
    interval = setInterval(
    function() {
    move(amount);
    },
    attr.time
    );
    };
    this.stop = function() {
    if (interval) {
    clearInterval(interval);
    }
    }
    
    function move(amount) {
    /* Werte refreshen */
    attr.top += amount;
    attr.height += amount;
    offset.top -= amount;
    /* Grenze überschritten? */
    if (attr.top < 0 || attr.height > offset.height) {
    attr.top -= amount;
    attr.height -= amount;
    offset.top += amount;
    return;
    }
    /* Object bewegen */
    obj.style.clip = "rect(" + attr.top + "px " + attr.width + "px " + attr.height + "px 0)";
    obj.style.top = offset.top + "px";
    }
    }

  2. #2
    kicia ist offline Routinier
    registriert
    05-02-2008
    Beiträge
    434

    AW: DIV Element mit eigener Scrollfunktion aktivieren?

    Hallo,
    wenn Du die Instanz "scroll" in der Funktion on() erstellst, sollte es funktionieren. Dann aber ohne var davor.
    Und Du solltest die Variable "scroll" schon vorher deklarieren, also einfach "var scroll;" am Anfang des <script> bereiches schreiben.
    Gruß, kicia

Ähnliche Themen

  1. div element verstecken
    Von thohei im Forum JavaScript
    Antworten: 10
    Letzter Beitrag: 20-03-2007, 18:13
  2. Antworten: 5
    Letzter Beitrag: 08-10-2006, 23:24
  3. script das div id ändert ?
    Von darkstar im Forum JavaScript
    Antworten: 2
    Letzter Beitrag: 22-08-2006, 13:02
  4. div element elegant auf knopfdruck vergrößern
    Von atvatar im Forum JavaScript
    Antworten: 6
    Letzter Beitrag: 06-08-2006, 15:23
  5. DIV Element in voller Höhe ausdehnen - klappt nicht
    Von Jack0815 im Forum CSS und (X)HTML
    Antworten: 6
    Letzter Beitrag: 14-01-2005, 16:02

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •