Eigenen Scrollbalken @ tutorials.de: Tutorials, Forum & Hilfe

one6666 · 10.03.10 01:46

Hallo,

ich habe gerade nach einer Lösung für einen Scrollbalken gesucht, und bin leider nicht fündig geworden

Hier im Forum sieht man viele Themen dazu, meistens wird scrollto() und scrollby() gepostet,
so könnte man schon mal in einen iframe mit Buttons Scrollen,
dann fehlt aber noch der Scrollbutton in der Mitte der sich anfassen list und mit gedrückter Taste verschieben list,
das würde ich aber noch hinbekommen

Nur das Scrollen über den mittleren Mauszeiger ist mir noch ein Rätsel, button() erkennt zwar das drücken der mittleren Taste aber nicht das drehen

Hat jemand eine Idee wie man das drehen des mittleren Mausrad erkennen kann ?

**Jan-Frederik Stieler** · 10.03.10 01:57

Hi,
um mit JQuery einen eigenen Scrollbalken zu realisieren gibts schon ein fertiges Plugin namens JScrollpane.
Läßt sich sehr leicht in die webseite einbinden und ist arbeitet auch mit allen modernen Browsern zusammen.

Viele Grüße

one6666 · 10.03.10 03:44

Hallo Jan-Frederik Stieler,

danke für deine Antwort ist schon sehr hilfreich,
zeigt sehr schön was ich vor habe,
doch leider kann ich nicht erkennen wie die das mit dem Laufrad geschafft haben

Das wäre eigentlich das einzigste was mich interessiert den rest schaff ich dann allein

Sven Mintel · 10.03.10 10:25

Zitat von one6666

doch leider kann ich nicht erkennen wie die das mit dem Laufrad geschafft haben

Beim Scrollen feuert ein Event: onscroll
Der wird überwacht...das ist das ganze Geheimnis

one6666 · 10.03.10 12:20

Ah genial, super Sven genau das hab ich gesucht

1000send Dank

one6666 · 11.03.10 03:55

Hallo,

ich komme mit meiner Scrollbar kein Stück weiter

,
ich sehe jetzt 2 Möglichkeiten einmal mit einen iframe zu arbeiten(so kann ich mir neben onscroll() noch scrollto() und scrollby() zu nutze machen ),
oder mit einen div zu arbeiten.

Den Weg mit dem div wollte ich zuerst gehen, aber ich weiß leider nicht wie ich eine Maske erstellen kann,
so das der übersflüßige Text nicht aus dem div geht, sondern einfach verschwindet, aber auch wie ich dann den Text in der Höhe bewegen kann ist mir noch ein Rätsel

1.Frage
Wie kann ich mir eine Maske erstellen?
2.Frage
Wie kann ich den Inhalt der Maske dann in die Höhe oder Tiefe bewegen?

Da ich da noch keine Antwort drauf gefunden hab, wollte ich den Weg mit dem iframe gehen,
scheint auch ganz easy zu sein, da sich das iframe wie eine Maske verhält, aber leider kann ich dem iframe nicht den Eventhändler onscroll zuweisen,
damit das geht muss ich im iframe dem body TAG den Event Händler zuweisen,
aber dann weis ich nicht wie ich aus dem iframe mein Javascript ansteuern kann

Frage 3
Wie kann ich aus dem iframe bei einer Action des Eventhändler eine normale Javascript function aufrufen ?

Anmerkung:
Ich würde gerne beide Wege einmal gehen, darum sind alle Fragen wichtig !

Enumerator · 11.03.10 08:33

Hi!

Zitat von one6666

Den Weg mit dem div wollte ich zuerst gehen, aber ich weiß leider nicht wie ich eine Maske erstellen kann,
so das der übersflüßige Text nicht aus dem div geht, sondern einfach verschwindet, aber auch wie ich dann den Text in der Höhe bewegen kann ist mir noch ein Rätsel

1.Frage
Wie kann ich mir eine Maske erstellen?
2.Frage
Wie kann ich den Inhalt der Maske dann in die Höhe oder Tiefe bewegen?

Im Ansatz geht das mit overflow:hidden (für die "Maske") und position:relative (für den Content):

HTML-Code:

<html>
 <head>
  <title> Test </title>
 </head>
 <body>
  <h1> Test </h1>
  <div style="height:100px;width:300px;overflow:hidden;border:1px solid">
   <p style="position:relative;top:-30px">
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
        nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
        sed diam voluptua. At vero eos et accusam et justo duo dolores et ea
        rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
        ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing
        elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
        aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
        dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus
        est Lorem ipsum dolor sit amet.
        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
        nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
        sed diam voluptua. At vero eos et accusam et justo duo dolores et ea
        rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
        ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing
        elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
        aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
        dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus
        est Lorem ipsum dolor sit amet.
        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
        nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,style.top
        sed diam voluptua. At vero eos et accusam et justo duo dolores et ea
        rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
        ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing
        elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
        aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
        dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus
        est Lorem ipsum dolor sit amet.
        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
        nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
        sed diam voluptua. At vero eos et accusam et justo duo dolores et ea
        rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
        ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing
        elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
        aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
        dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus
        est Lorem ipsum dolor sit amet.
   </p>
  </div>
 </body>
</html>

Zitat von one6666

Frage 3
Wie kann ich aus dem iframe bei einer Action des Eventhändler eine normale Javascript function aufrufen ?

Du kannst aus dem iframe mit window.parent auf das Eltern-Fenster zugreifen - einfach mal den Abschnitt Frames bei SelfHTML anschauen...

Gruß
Enum

[EDIT]
Zu Frage 2: Mit JavaScript kannst Du die style.top Eigenschaft des Content-Containers setzen...

one6666 · 11.03.10 08:57

Ah genial, das ist genau das was ich brauchte 1000send Dank

tut orials.de	tut verbinden	tut dir helfen	tut kooperieren
©2000-2012 tutorials.de Alle Rechte vorbehalten	tut informieren » Impressum » Nutzungsregeln » Netiquette » Team » Redaktion	» Tutorials » Videotutorials » Showroom » Events & Contests » Chat » RSS-Feed » Blogs	» der-webdesigner.net » DesignerInAction » Design Nation » Directorforum » Flashhilfe » PHP-Resource » PHPwelt » PSD-Tutorials

Themen-Optionen

Anzeige

Ähnliche Themen

VB.Net - Eigenen Datentyp

Tagging in der eigenen Galerie bzw. auf der eigenen Homepage

Dateiensystem des eigenen CMS

Eigenen Homeserver

Eigenen IRCD für LAN

E-Mail:

Abonnieren Abbestellen