• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Scrollbar im div Container

P

Paiden

Neues Mitglied
Hi dies ist mein erster Thread und mein erstes eigenes Projekt an einer Website. Von daher dachte ich, ich melde mich an um gewiss einigen Problemen auf dem Grund zu gehen^^

Mein Problem ist folgendes:

ich habe ein div Container mit einer festen höhe. wenn ich zu viel Inhalt habe kann darin gescrollt werden. nur sieht die Standard Scrollbar nicht gut aus da ich auch ein border-radius nutze.

jetzt möchte ich die austauschen und habe dabei folgende Seite gefunden

jQuery custom content scroller – malihu | web design

mir persönlich gefällt in der Demo die ganz rechte und/oder die in der Mitte ganz unten.

leider bin ich der englischen Sprache nicht 100%ig mächtig und habe da gewisse Schwierigkeiten dies einzurichten. sitzte da schon einige zeit lang dran... ich hoffe ihr könnt mir helfen da durch zu gelangen so das ich von meinem Container den border-radius wieder sehen kann!


mfg Paiden
 
Werbung:
Wie sieht denn dein Versuch aus?

Moderation: Verschoben von HTML zu JavaScript, da es um jQuery geht. Bitte künftig drauf achten wo Du ein Thema eröffnest.
 
ah danke war mir jetzt nicht so sicher wo genau ich das hintun sollte^^ aber das werde!


in moment bin ich wieder auf anfang zurück so das ich im head bereich nur die verweise auf die script dateien eingefügt habe. hinzu kommt noch das ich eine lytebox eingebaut habe die auch Wunderbar funktioniert :D

es geht um den folgenden ersten container der eine feste höhe hat. wenn ich den mit inhalt der content div fülle kommt eben der overflow zum einsatz. und da sollte eig nur die scrollbar geändert werden^^

HTML: 
<head>
   <link href="jquery.mCustomScrollbar.css" rel="stylesheet" type="text/css" />    
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>    
   <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>    
   <script src="jquery.easing.1.3.js" type="text/javascript"></script>    
   <script src="jquery.mousewheel.min.js" type="text/javascript"></script>
</head>

<div id="seitenstreifen" class="dropdown" style="width:auto; height:460px; overflow:auto;">    
<p id="porttext">Composing Bilder</p>        
   <p>            
      <div class="content" align="center">                                
   
   </div>            
</p>
    
<p id="porttext">Signatur Pictures</p>        
   <p>            
      <div class="content" align="center">                
                
       </div>            
   </div>
</p>
 
Werbung:
Kann man das auch irgendwo komplett sehen? Oder anders gefragt: hast du auch einen Link zu deiner Seite parat?
 
nein hochgeladen habe ich die seite noch nicht, da sie noch stark im aufbau ist.

da ich es nicht hinbekommen habe hier beim anhang das anzuhängen habe ich es mal anderswo hochgeladen. die eigentlichen bilder habe ich mal entfernt sonst wäre das zu groß geworden. am besten zu sehen ist mein problem wenn das browser fenster in der breite verkleinert wird.

HTML_-Paidens-Website.zip
 
nur sieht die Standard Scrollbar nicht gut aus da ich auch ein border-radius nutze.
Zum Vergrößern anklicken....

hab' grad mal was ausprobiert:

HTML: 
div#boxMitBorderRadius {
    width:300px;
    height:300px;
    border-radius:20px;
    overflow:hidden;
    border:1px solid black;
}
    div#boxMitScrollBalken {
        width:300px;
        height:260px;
        margin-top:20px;
        overflow-x:hidden;
        overflow-y:scroll;
    }
        div#boxMitText {
            width:300px;
            height:400px;
        }

HTML: 
<div id="boxMitBorderRadius">
    <div id="boxMitScrollBalken">
        <div id="boxMitText">abc</div>
    </div>
</div>

... das DIV boxMitText müsste nur so angepasst werden, dass bei boxMitScrollBalken overflow-x:hidden; nicht gebraucht werden müsste ... achtung: die Breite des Scrollbalkens kann bei jedem User anders sein.

EDIT: wenn es nicht um das aussehen der Scrollbar geht, sondern nur um das BorderRadius, wäre dies ein kleiner Lösungsansatz ;-)
 
Werbung:
hm ja das ist definitiv ein lösungsansatz! und funktioniert auch soweit! echt top! ich glaube aber trotzdem das ich die scrollbar austauschen möchte...
schade ist auch das die scrolbar jetzt die ganze zeit zu sehen ist. die soll nur dann sichtbar sein wenn der inhalt größer ist als die div box.

ich hoffe das war verständlich^^ musste selber ein wenig über den satz nachdenken xD
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben