שאלה| איך להחליף את הscrollbar באחד משלי?

[Rebuilt]

צהריים טובים!
איך אני יכול להחליף את הscrollbar (המעלית האפורה והמשעממת בצד) באחד משלי?
אני לא רוצה לשים scroll בתוך DIV כי זה לא מה שאני צריך.

מה שחשבתי עליו זה לעשות בCSS את זה - overflow: hidden;
ואז לתת לdiv container את הSCROLL BAR שלי...
אבל זה לא נראה לי הגיוני אני כמעט בטוח שאפשר להחליף את הרגיל של הדפדפן לאחד מלא חיים ** באתר שלי ספציפית **, אני חושב שראיתי כאלה דברים בעבר.

תודה מראש...

[אדיר]

https://www.google.co.il/search?&q=css+scrollbar
רצוי לשלב modernizr ולבדוק מתי יש תמיכה native ומתי צריך להשתמש ב- polyfill.

בהצלחה.

[Rebuilt]

נכתב במקור על ידי xPerfection

https://www.google.co.il/search?&q=css+scrollbar
רצוי לשלב modernizr ולבדוק מתי יש תמיכה native ומתי צריך להשתמש ב- polyfill.

בהצלחה.

תודה.
חיפשתי כמה ומצאתי דווקא יפים (כjquery plugins) אבל לא הבנתי איך אני משלב אותם במקום המעלית האפורה והרגילה.

ולפי החיפוש שלך מצאתי רק מעליות רגילות פשוט בצבע אחר, אני רוצה לעגל פינות וזה שיצא יפה.
יש כאן דוגמה לזה:
http://blog.ngopal.com.np/2012/07/11...llbar-via-css/
תמונה של החלק שאהבתי:
http://i1.wp.com/blog.ngopal.com.np/...size=453%2C220

הוא שם שם סלקטור של class זה אומר שהוא שם את זה איפהשהוא בHTML... אבל איפה?
ומה זה -fx?

סליחה על החפירה, אשמח לעזרה

[mayden]

אם אתה רוצה את ה thumb מעוגל - פשוט תמשתמש במאפיינים של radius.

תבדוק את האתרים הראשונים:
https://www.google.co.il/search?hl=i...nded+scrollbar

שם יש לך את כל מה שאתה צריך לסקרול-בר מעוגל.

[IgalSt]

לכרום יש תמיכה באמצעות מאפיין שלהם כפי שכבר צויין.
מומלץ לעשות בדיקה עם מודרניזר כמו שכבר הוצע על מנת לבדוק את מידת התמיכה של הדפדפן (שכל אולי בעתיד דפדפנים נוספים יציעו תמיכה) ובמידה ולא קיימת לממש באמצעות JS (ע"י plugin כלשהו לדוגמה).
לרוב ה-Plugins האלה דורשים מצב התחלתי של scrollbar רגיל המוצג על המסך ואם זה המקרה עם יודעים להתמודד עם הוספת scroll מעוצב במקומות.
עם זאת, ייתכן ואם מדובר ב-scroll על ה-body הם לא ידעו להתמודד.
לכן אולי דאי להגיע למצב שעל ה-body שלך אין scrollbar אבל בתוכו יש איזהו אלמנט שיש לו overflow:auto ותופס את כל השטח של ה-body.

דוגמה פשוטה המשתמשת ב- LionBars
http://jsfiddle.net/igalst/CsrxB/

(שים לב רק שלא בדקתי תמיכה של כרום)

[Rebuilt]

נכתב במקור על ידי IgalSt

לכרום יש תמיכה באמצעות מאפיין שלהם כפי שכבר צויין.
מומלץ לעשות בדיקה עם מודרניזר כמו שכבר הוצע על מנת לבדוק את מידת התמיכה של הדפדפן (שכל אולי בעתיד דפדפנים נוספים יציעו תמיכה) ובמידה ולא קיימת לממש באמצעות JS (ע"י plugin כלשהו לדוגמה).
לרוב ה-Plugins האלה דורשים מצב התחלתי של scrollbar רגיל המוצג על המסך ואם זה המקרה עם יודעים להתמודד עם הוספת scroll מעוצב במקומות.
עם זאת, ייתכן ואם מדובר ב-scroll על ה-body הם לא ידעו להתמודד.
לכן אולי דאי להגיע למצב שעל ה-body שלך אין scrollbar אבל בתוכו יש איזהו אלמנט שיש לו overflow:auto ותופס את כל השטח של ה-body.

דוגמה פשוטה המשתמשת ב- LionBars
http://jsfiddle.net/igalst/CsrxB/

(שים לב רק שלא בדקתי תמיכה של כרום)

תוכל להעתיק את הcss לכאן? אני לא מצליח לראות אותו מהפלא, אגב יצא ממש יפה.
תודה מראש

[IgalSt]

נכתב במקור על ידי Rebuilt

תוכל להעתיק את הcss לכאן? אני לא מצליח לראות אותו מהפלא, אגב יצא ממש יפה.
תודה מראש

html,
body,
.wrapper {
    width: 100%;
    height: 100%;

}

body {
    overflow: hidden;
}

.wrapper {
    overflow: auto;
}

[Rebuilt]

נכתב במקור על ידי IgalSt

html,
body,
.wrapper {
    width: 100%;
    height: 100%;

}

body {
    overflow: hidden;
}

.wrapper {
    overflow: auto;
}

התכוונתי את הcss שיש בfiddle...

[Rebuilt]

נכתב במקור על ידי IgalSt

לכרום יש תמיכה באמצעות מאפיין שלהם כפי שכבר צויין.
מומלץ לעשות בדיקה עם מודרניזר כמו שכבר הוצע על מנת לבדוק את מידת התמיכה של הדפדפן (שכל אולי בעתיד דפדפנים נוספים יציעו תמיכה) ובמידה ולא קיימת לממש באמצעות JS (ע"י plugin כלשהו לדוגמה).
לרוב ה-Plugins האלה דורשים מצב התחלתי של scrollbar רגיל המוצג על המסך ואם זה המקרה עם יודעים להתמודד עם הוספת scroll מעוצב במקומות.
עם זאת, ייתכן ואם מדובר ב-scroll על ה-body הם לא ידעו להתמודד.
לכן אולי דאי להגיע למצב שעל ה-body שלך אין scrollbar אבל בתוכו יש איזהו אלמנט שיש לו overflow:auto ותופס את כל השטח של ה-body.

דוגמה פשוטה המשתמשת ב- LionBars
http://jsfiddle.net/igalst/CsrxB/

(שים לב רק שלא בדקתי תמיכה של כרום)

סליחה על ההודעה הכפולה (זה ממש דחוף), אבל...
בדוגמא ראיתי שבפיירפוקס זה לא עובד (הורדתי את זה מgithub והפעלתי את demo.html + index.html זה עושה סליידר רגיל.

אין שום דבר שתומך בפיירפוקס ?

[Rebuilt]

לא ראיתי משהו בחוקים שנוגד הקפצות...
אין משהו שתומך בפיירפוקס? אני רוצה שבכל הדפדפנים יהיה את הסליידר ולא רק בכרום וספארי.
דרך אגב זה דורש דיב קונטיינר?