zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Eigene Scrollbar - Problem mit overflow:hidden

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 07.08.2015, 11:21
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.08.2015
Beiträge: 13
nextuser befindet sich auf einem aufstrebenden Ast
Standard Eigene Scrollbar - Problem mit overflow:hidden

Hallo Leute,

bin neu hier und habe auch ein Problem. Ich möchte eine eigene Scrollbar erstellen, jedoch
ohne JQuery sondern mit "reinem" Javascript. Habe folgendes
gefunden:

Custom Scrollbars

Bin soweit auch damit zufrieden. Gibt nur ein Problem bei mir. Ich möchte eine schmalere Scrollbar.
Doch dann sieht man die standard Scrollbar. Wenn ich bei "#main_content" overflow:hidden setze, so
verschwindet die Standard-Scrollbar. Jedoch kann ich dann nicht mer mit dem Mausrad
scrollen. Habe im Netz gelesen, das es besonders beim Firefox so ist. Weiss jemand, wie ich es beheben kann?

In den Kommentaren auf der Seite hat jemand das gleiche Problem angesprochen:
Zitat:
Hello! I wanted to make the slider more narrow than original (20px in js – line #89). But when I use
lower value (5px for example) the default slider is visible behind the custom one. Do you have any solution for that?
Darauf antwortete der Admin:
Zitat:
Yes, you can also apply ‘overflow: hidden’ for #main_content element (instead ‘auto’)
Was ja nicht wirklich zufriedenstellend ist.
Weiter unten verwies der Admin dann auf dem Kommentar eines anderen:
Zitat:
after the line: if (! ssb.init()) return false;
just add another line like this: if(cont.scrollHeight <= cont.clientHeight) return false;
and you're good to go on auto-hiding the scrollbar for non-oerflowing content.
Ich habe keine Ahnung, wieso der Admin auf diesen Kommentar verwiesen hat. Geholfen
hat es jedenfalls nicht, schließlich geht es da ja um was anderes.
Kann mir einer helfen?
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 07.08.2015, 13:30
Benutzerbild von Thielo
Web Ninja
XHTMLforum-Kenner
 
Registriert seit: 17.09.2009
Ort: Stuttgart oder so
Beiträge: 3.378
Thielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein Lichtblick
Standard

Evtl. einfach ein besseres Script benutzen?

jQuery NiceScroll plugin - scrolling for desktop, mobile and touch devices
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato...
All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege

www.richard-thiel.de | Müssen Websiten überall gleich ausschauen?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 08.08.2015, 06:39
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.08.2015
Beiträge: 13
nextuser befindet sich auf einem aufstrebenden Ast
Standard

Ich habe auch ein paar JQuery-Lösungen in anderen Seiten eingebaut. Hier möchte
ich jedoch keine Plugins/Bibliotheken verwenden. Ich möchte alles selbst machen.
Kann mir jemand sagen, warum ich nicht scrollen kann?
Mit Zitat antworten
  #4 (permalink)  
Alt 08.08.2015, 09:33
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.928
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von nextuser Beitrag anzeigen
Hier möchte
ich jedoch keine Plugins/Bibliotheken verwenden. Ich möchte alles selbst machen.
???
Du widersprichst dir, das Skript ist doch nicht selbstgemacht?
Mit Zitat antworten
  #5 (permalink)  
Alt 10.08.2015, 12:17
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.08.2015
Beiträge: 13
nextuser befindet sich auf einem aufstrebenden Ast
Standard

Konnte erst jetzt wieder reinschauen.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
???
Du widersprichst dir, das Skript ist doch nicht selbstgemacht?
Nein, das natürlich nicht. Ich habe ihn nur angepasst und getippt. Selbstgemacht ist hier das falsche Wort.
Was ich meinte war, ich möchte selber wissen, was genau ich da für Code geschrieben/übernommen habe. Ich möchte gerne alles selber tippen, allein schon wegen dem
guten Lerneffekt. Ein Plugin/eine Bibliothek ist nicht das, was ich möchte. Deshalb ist der Verlinkte CodeBeispiel auch so interessant für mich.
Kann mir wirklich keiner sagen, wie ich mit verdekter Standart-Scrollbar trotzdem scrollen kann?
Mit Zitat antworten
  #6 (permalink)  
Alt 10.08.2015, 12:41
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.928
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von nextuser Beitrag anzeigen
Nein, das natürlich nicht. Ich habe ihn nur angepasst und getippt. Selbstgemacht ist hier das falsche Wort.
Was ich meinte war, ich möchte selber wissen, was genau ich da für Code geschrieben/übernommen habe. Ich möchte gerne alles selber tippen, allein schon wegen dem
guten Lerneffekt. Ein Plugin/eine Bibliothek ist nicht das, was ich möchte. Deshalb ist der Verlinkte CodeBeispiel auch so interessant für mich.
Du meinst du hast einen besseren Lerneffekt, mit einem Skript das nicht funktioniert, als mit einem das funktioniert?

Der Umgang mit jQuery Skripten bringt dir vermutlich mehr JS Kenntnisse, als wenn du dich um jedes Browserdetail rumärgern musst.

Zitat:
Zitat von nextuser Beitrag anzeigen
Kann mir wirklich keiner sagen, wie ich mit verdekter Standart-Scrollbar trotzdem scrollen kann?
Ich würde so was aus Prinzip nicht nutzen, da Bedienelemente etwas sind, was alle Nutzer kennen und diese so zu verändern, das sie evtl. nicht mehr so aussehen wie es der Nutzer kennt, macht deine Seite schlechter bedienbar.

Was ich aber im Grunde nicht verstehe, warum overflow:hidden nicht zufriedenstellend ist?
Das dann der Text markiert wird, liegt daran, dass der mousdown und mousemove Event nicht das Standardhandling abbrechen. Das erreichst du am einfachsten mit return false
Mit Zitat antworten
  #7 (permalink)  
Alt 12.08.2015, 13:27
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.08.2015
Beiträge: 13
nextuser befindet sich auf einem aufstrebenden Ast
Standard

Hi protonenbeschleuniger,

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Du meinst du hast einen besseren Lerneffekt, mit einem Skript das nicht funktioniert, als mit einem das funktioniert?
Naja, dadurch kann man ja auch was lernen, wenn man das Problem dann gelöst hat...
Und ja, ich finde mit einem selbst erstellten bzw. abgetippten Script habe ich einen größeren Lerneffekt, als mit einem "fremden", dessen Inhalt ich nicht einmal wirklich kenne.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Der Umgang mit jQuery Skripten bringt dir vermutlich mehr JS Kenntnisse, als wenn du dich um jedes Browserdetail rumärgern musst.
Das sehe ich anders. Ich mag es, mich mit jedem "Browserdetail" rumzuärgern. Außerdem benutze ich JS ja nur für einige wenige Sachen. Mir geht es weniger darum, möglichst
mehr JS-Kenntnisse "rauszuholen". Ich bin nur so einer, der gerne "im Detail" verstehen möchte,
wie man eigene Sachen(wie eine Scrollbar) umsetzen kann und dazu möchte ich auch genau den Code dahinter verstehen.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Ich würde so was aus Prinzip nicht nutzen, da Bedienelemente etwas sind, was alle Nutzer kennen und diese so zu verändern, das sie evtl. nicht mehr so aussehen wie es der Nutzer kennt, macht deine Seite schlechter bedienbar.
Auch das sehe ich etwas anders. Ich möchte ja nichts total "exotisches" machen. Meine Scrollbar wird sicherlich auch als solche erkannt werden.
Und warum das meine Seite jetzt schlechter bedienbar machen sollte, verstehe ich nicht.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Was ich aber im Grunde nicht verstehe, warum overflow:hidden nicht zufriedenstellend ist?
overflow:hidden versteckt die Standard-Scrollbar. Das Problem(ich bezeichne es als solches) ist, das dabei aber nicht
mehr mit dem Mausrad oder der Tastatur gescrollt werden kann. Ich bin jemand, der es nicht mag "manuel" mit der Scroll-Leiste scrollen zu müssen.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Das dann der Text markiert wird, liegt daran, dass der mousdown und mousemove Event nicht das Standardhandling abbrechen. Das erreichst du am einfachsten mit return false
Von "Text markiert" als Problem habe ich nie gesprochen. Das ist mir schon bewusst.


PS: So, jetzt schaffe ich es auch wieder öffter hier vorbeizuschauen.

Was mein Problem angeht, so bleibe ich hartnäckig. Ich suche weiterhin, nach einer Lösung.
Wäre natürlich toll, wenn jemand von euch weiter weiss.
Danke auch für alle bisherigen Antworten.
Mit Zitat antworten
  #8 (permalink)  
Alt 12.08.2015, 14:19
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.928
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von nextuser Beitrag anzeigen
Naja, dadurch kann man ja auch was lernen, wenn man das Problem dann gelöst hat...
Und ja, ich finde mit einem selbst erstellten bzw. abgetippten Script habe ich einen größeren Lerneffekt, als mit einem "fremden", dessen Inhalt ich nicht einmal wirklich kenne.
Du benutz ein "fremdes" Skript, ich verstehe deine Argumentation nicht. Wenn du ein selbst entwickeltes Skript hier zeigen würdest, dann könnte ich die Argumentation nachvollziehen, aber das tust du ja nicht.

Zitat:
Zitat von nextuser Beitrag anzeigen
Auch das sehe ich etwas anders. Ich möchte ja nichts total "exotisches" machen. Meine Scrollbar wird sicherlich auch als solche erkannt werden.
Und warum das meine Seite jetzt schlechter bedienbar machen sollte, verstehe ich nicht.

[...]

overflow:hidden versteckt die Standard-Scrollbar. Das Problem(ich bezeichne es als solches) ist, das dabei aber nicht
mehr mit dem Mausrad oder der Tastatur gescrollt werden kann. Ich bin jemand, der es nicht mag "manuel" mit der Scroll-Leiste scrollen zu müssen.
Wieder so ein Widerspruch, zuerst sagst du du verstehst nicht, warum die Seite schlechter bedienbar sein soll und dann im nächsten Absatz merkst du es selbst. Solche Skripte verändern das Scrollverhalten, dass die Nutzer auf ihren Geräten gewohnt sind, das ist ein Eingriff in die Usability.
Darüber hinaus ist es auch nicht sonderlich gut, da es nicht sauber mit dem Eventhandling des Browsers umgeht.

Zitat:
Zitat von nextuser Beitrag anzeigen
Von "Text markiert" als Problem habe ich nie gesprochen. Das ist mir schon bewusst.
Inwiefern war dir das bewusst?
Das ist ein Fehler des von dir verwendeten Skript und ich hab dir gesagt wie du diesen Fehler beseitigen kannst.

Zitat:
Zitat von nextuser Beitrag anzeigen
Was mein Problem angeht, so bleibe ich hartnäckig. Ich suche weiterhin, nach einer Lösung.
Wäre natürlich toll, wenn jemand von euch weiter weiss.
Danke auch für alle bisherigen Antworten.
Es gibt nur diese eine Lösung die dir nicht gefällt.
Mit Zitat antworten
  #9 (permalink)  
Alt 13.08.2015, 00:02
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 07.08.2015
Beiträge: 13
nextuser befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Du benutz ein "fremdes" Skript, ich verstehe deine Argumentation nicht. Wenn du ein selbst entwickeltes Skript hier zeigen würdest, dann könnte ich die Argumentation nachvollziehen, aber das tust du ja nicht.
Ich habe doch geschrieben, das ich dieses Skript abgetippt habe. Dabei habe ich unter anderem durch googeln bestimmter Begriffe schon mehr dazugelernt.
Ja, ich habe das Skript nicht selbst erstellt, mich jedoch intensiv damit auseinadergesetzt und auch nicht einfach kopiert. Würde ich jetzt JQuery verwenden, könnte ich nicht im
Detail lernen, wie es "intern" mit einer eigenen Scrollbar funktioniert. Das habe ich unter "fremdes" gemeint.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Wieder so ein Widerspruch, zuerst sagst du du verstehst nicht, warum die Seite schlechter bedienbar sein soll
Als ich das gesagt habe, ging ich von meiner fertigen Scrollbar aus, die sich auch scrollen lässt. In diesem Fall wäre die Seite eben NICHT schlechter
bedienbar und somit auch kein Widerspruch. Ich denke, das sollte klar sein, was ich damit gemeint habe.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
und dann im nächsten Absatz merkst du es selbst. Solche Skripte verändern das Scrollverhalten, dass die Nutzer auf ihren Geräten gewohnt sind, das ist ein Eingriff in die Usability.
Nein, da das fehlende Scrollverhalten ja genau das Problem ist, welches ich lösen möchte. Es ist ja möglich seine eigene Scrollbar
zu erstellen. JQuery ist im Endeffekt ja auch Javascript. Ich möchte das halt ohne Bibliothek umsetzen.
Das Scrollverhalten IST ja umsetzbar, deshalb ist es auch kein Eingriff in die Usability, wenn es denn dann läuft.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Inwiefern war dir das bewusst?
Das ist ein Fehler des von dir verwendeten Skript und ich hab dir gesagt wie du diesen Fehler beseitigen kannst.
Es war mir bewusst, dass das ein Fehler ist. Mit meiner Aussage:
Zitat:
Zitat von nextuser Beitrag anzeigen
Von "Text markiert" als Problem habe ich nie gesprochen. Das ist mir schon bewusst.
Meinte ich, dass mir der Fehler bewusst ist, dieser aber momentan nicht wichtig ist. Es geht hier um das Problem mit dem Scrollverhalten und nicht um diesen Fehler.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Es gibt nur diese eine Lösung die dir nicht gefällt.
Das denke ich nicht. Mit JQuery geht es ja und JQuery ist "nur" eine Javascript-Bibliothek, weshalb das gleiche Ergebnis auch mit "reinem" Javascript erzielt werden kann. Und genau da will ich hin.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 13.08.2015, 08:27
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.928
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von nextuser Beitrag anzeigen
Ja, ich habe das Skript nicht selbst erstellt, mich jedoch intensiv damit auseinadergesetzt und auch nicht einfach kopiert. Würde ich jetzt JQuery verwenden, könnte ich nicht im
Detail lernen, wie es "intern" mit einer eigenen Scrollbar funktioniert. Das habe ich unter "fremdes" gemeint.
Das ist Quatsch, mit jQuery lernst du wie - schon gesagt - genauso, wie man JS programmiert. Da du dich aber nicht mit Browser-"merkwürdigkeiten" beschäftigen musst, kannst du dich auf das Lernen konzentrieren und würdest die Details von JS schneller verstehen (Browserbugs sind keine JS Details!)

Zitat:
Zitat von nextuser Beitrag anzeigen
Als ich das gesagt habe, ging ich von meiner fertigen Scrollbar aus, die sich auch scrollen lässt. In diesem Fall wäre die Seite eben NICHT schlechter
bedienbar und somit auch kein Widerspruch. Ich denke, das sollte klar sein, was ich damit gemeint habe.
Ja das ist klar aber es ist falsch.

Da die JS-Scrollbar sich anders verhält, als normal, ist die Seite schlechter bedienbar.

Zitat:
Zitat von nextuser Beitrag anzeigen
Nein, da das fehlende Scrollverhalten ja genau das Problem ist, welches ich lösen möchte. Es ist ja möglich seine eigene Scrollbar
zu erstellen. JQuery ist im Endeffekt ja auch Javascript. Ich möchte das halt ohne Bibliothek umsetzen.
Das Scrollverhalten IST ja umsetzbar, deshalb ist es auch kein Eingriff in die Usability, wenn es denn dann läuft.
Noch mal, die Scrollbar verhält sich anders.

z.b. ist es bei mir so, dass wenn ich auf einen "leeren" Bereich innerhalb der Scrollbar klicke, die Seite sich eine Seite nach oben oder unten bewegt, die von dir benutzte springt an diese Stelle. dieses Verhalten kann von System zu System unterschiedlich sein.

Zitat:
Zitat von nextuser Beitrag anzeigen
Meinte ich, dass mir der Fehler bewusst ist, dieser aber momentan nicht wichtig ist. Es geht hier um das Problem mit dem Scrollverhalten und nicht um diesen Fehler.
Und ich habe dir einen Satz geschrieben, wie dieses Problem beseitigt werden könnte. Das wären zwei Zeilen Code.

Keine Ahnung warum dir jetzt so wichtig ist diesen Fehler zu behalten, dass du mir dauernd etzählen musst, dass die der Fehler "bewusst" ist.

Die sollte aber auch bewusst sein, dass dies ein Fehler in diesem Skript ist, da es sich nicht um das Eventhandling des Browsers kümmert.

Zitat:
Zitat von nextuser Beitrag anzeigen
Das denke ich nicht. Mit JQuery geht es ja und JQuery ist "nur" eine Javascript-Bibliothek, weshalb das gleiche Ergebnis auch mit "reinem" Javascript erzielt werden kann. Und genau da will ich hin.
Gibt es ein jQuery Skript, dass sich genau so verhält, wie du es erwartest?

Dann könntest du Anhand dieses Sktiptes vielleicht lernen, wie es gehen könnte. Aber mit dem Code, den du jetzt benutzt kommst du nicht weiter, da er nicht die Funktionalität hat die du wünscht.

Um das mal abzukürzen, du kannst entweder ein Skript suchen, dass deine kompletten Erwartungen erfüllt oder du musst es dir programmieren. D.h. du musst in das bestehende Skript einen Handler einbauen, der auch auf das Scrollrad reagiert, damit du die Scollbar verstecken kannst - aber können die Leute, die JS erstmal deaktivieren (NoScript ist eines der beliebsten Firefox AddOn) die Seite gar nicht mehr benutzen.
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Sticky Footer Problem - Scrollbar img CSS 5 05.03.2011 18:51
Div 100%-X Höhe Problem, ohne absolute Positionierung xblax CSS 8 28.10.2010 02:02
Mitwachsender Content und Footer Problem Bentham CSS 5 19.09.2010 12:49
IE 7: Zoom Problem, Höhen Problem, Text problem Cu Chullain CSS 4 02.09.2010 14:56
XHTML 1.1 Problem mit Frames und IE opa-rudi (X)HTML 5 01.07.2007 02:36


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:36 Uhr.