Antworten auf deine Fragen:
Neues Thema erstellen

Overflow Scroll -ausblenden oder....

imac123

Nicht mehr ganz neu hier

Hallo

Wie kann ich die erstellte Scrolleiste ausblenden oder kleiner machen? Es sollte nicht über den schwarzen Rand hinaus laufen.

Die Scrollleiste ist notwendig, sobald es viel Text hat, aber es sieht nicht schön aus, wenn es über den schwarzen Rand herausgeht (siehe Foto)

Ich habe es mit:
CSS:
overflow: scroll
erstellt.


Hier noch Link:

Danke
 
Zuletzt bearbeitet:

Myhar

Hat es drauf

Was ist das für ein schwarzer Rand, kommt der von einem Bild? Wenn ja, dann hast du keine Möglichkeit, die Scrollleiste nicht darüber laufen zu lassen. Nachdem ich keine Ahnung von deinem HTML/CSS habe kann ich dir auch leider keine weiteren Hinweise geben.
 

imac123

Nicht mehr ganz neu hier

Hallo es ist kein Bild, sonder ein Radius...

Es wurde ein Div Container erstellt und alles andere wurde in CSS gemacht.

CSS
CSS:
border:12px solid black;
border-bottom-right-radius:45%;
border-bottom-left-radius:45%;

Das es keine Möglichkeit für ein Bild hat kann ich verstehen,,aber für Radius ? :rolleyes:


@afr0kalypse da werde ich auch nicht schlauer hmm...wie soll das funktionieren? :(
 

imac123

Nicht mehr ganz neu hier

Hmm brauche ich doch keinen jQuery ... Die Scrolleiste wird jetzt hinter dem schwarzen Rand weitergeführt ....



CSS:
#inhalt{
    margin-left: 10px;
    margin-right: 5px;
    margin-bottom: 10px;
    /*border: 1px solid #333;*/
    /*overflow: hidden;*/
    height: 830px;
    width: auto;
    overflow: scroll;
    /*background: gray;*/
    background: transparent;
    z-index: 2;
    border-bottom-right-radius:47%;
    border-bottom-left-radius:40%;
    }


Unter .container habe ich nur: overflow: hidden hinzugefügt....

CSS:
.container {
    border:25px solid #000;
    border-bottom-right-radius:50%;
    border-bottom-left-radius:45%;
    z-index:17;
    overflow: hidden;
    }
 

imac123

Nicht mehr ganz neu hier

Wieder ich. .....

In Safari und Chrome funktioniert es (Scrolleiste wird versteckt)..siehe Bild Nr.2

In Firefox und IE funktioniert es leider nicht -_- siehe Bild Nr.1


Oben Genanntes jQuery funkt. nicht...

In Firefox/ Internet Explorer => sieht nicht gut aus.....




In Chrome/Safari wird schön hinter der Schwarze Markierung versteckt.




Danke.
 

tr4ze

Mod | Forum

Teammitglied
PSD Beta Team
Also nochmal, nur mit CSS wird das nicht gehen.
Du brauchst 2 Elemente, eines mit dem du scrollst und eines das du mit dem Scroll-Element synkronisierst(Also dein Text).
Das funktioniert auf dem Desktop sehr gut mit Jquery. Hier mal ein Fiddle ->
http://jsfiddle.net/sgcer/
Viele moderne OnePager nutzen diese Technik wenn es um Paralax Effekte und ähnliches geht.
Nur bei mobilen Geräten könntest du da mit der Stromsparfunktion kollidieren.
Das liegt daran das Javascript Single Threaded ist, und mobile Browser den Parser während des Scollens anhalten(um Rechenleistung/Energie zu sparen).
Aber auch dafür gibt es verschiedene Workarounds(TranslateX bzw. Canvas).

Ob sich der Aufwand für so einen fragwürdigen Effekt allerdings lohnt musst du selber entscheiden.
 

imac123

Nicht mehr ganz neu hier

@tr4ze jetzt habe ich verstanden was du meinst. :danke::daumenhoch

Die Frage ist nur, welcher Browser meckert bei dieser Lösung? bestimmt IE ?:rolleyes: kann leider jetzt nicht mehr Testen.
 

tr4ze

Mod | Forum

Teammitglied
PSD Beta Team
Jquery 1.9 läuft noch auf IE 6/7/8 das CSS ist 2.1, sollte also funktionieren.
Probleme wird es höchstens auf mobilen Browsern geben s.o..
 

imac123

Nicht mehr ganz neu hier

Hmm bei mir funktioniert das mit Scrollen immer noch nicht ..

Immer wenn ich div {...} aktiviere dann verschiebt sich alles (zb. Navigation ist anders platziert)...sobald ich div{...} auskommentiert habe sieht die Seite ok aus...

Kann ich ein anderes Element ausser div{...} setzen? mit zb. div#top{...} geht auch nicht..
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Keine Mitglieder online.

Statistik des Forums

Themen
118.634
Beiträge
1.538.448
Mitglieder
67.555
Neuestes Mitglied
scheflo
Oben