הוסטס - פורום אחסון האתרים הגדול בישראל

הוסטס - פורום אחסון האתרים הגדול בישראל (https://hosts.co.il/forums/index.php)
-   פורום תיכנות (https://hosts.co.il/forums/forumdisplay.php?f=14)
-   -   שאלה| איך להחליף את הscrollbar באחד משלי? (https://hosts.co.il/forums/showthread.php?t=102442)

Rebuilt 08-02-13 16:54
שאלה| איך להחליף את הscrollbar באחד משלי?
 
צהריים טובים!
איך אני יכול להחליף את הscrollbar (המעלית האפורה והמשעממת בצד) באחד משלי?
אני לא רוצה לשים scroll בתוך DIV כי זה לא מה שאני צריך.

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

תודה מראש... :)

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

בהצלחה.

Rebuilt 08-02-13 19:45
ציטוט:
נכתב במקור על ידי xPerfection (פרסם 870314)
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 08-02-13 20:37
אם אתה רוצה את ה thumb מעוגל - פשוט תמשתמש במאפיינים של radius.

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

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

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

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

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

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

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

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

IgalSt 09-02-13 19:29
ציטוט:
נכתב במקור על ידי Rebuilt (פרסם 870362)
תוכל להעתיק את הcss לכאן? אני לא מצליח לראות אותו מהפלא, אגב יצא ממש יפה.
תודה מראש :)
קוד:
html,
body,
.wrapper {
    width: 100%;
    height: 100%;

}

body {
    overflow: hidden;
}

.wrapper {
    overflow: auto;
}

Rebuilt 09-02-13 19:36
ציטוט:
נכתב במקור על ידי IgalSt (פרסם 870381)
קוד:
html,
body,
.wrapper {
    width: 100%;
    height: 100%;

}

body {
    overflow: hidden;
}

.wrapper {
    overflow: auto;
}

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

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

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

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

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

Rebuilt 11-02-13 19:22
לא ראיתי משהו בחוקים שנוגד הקפצות...
אין משהו שתומך בפיירפוקס? אני רוצה שבכל הדפדפנים יהיה את הסליידר ולא רק בכרום וספארי.
דרך אגב זה דורש דיב קונטיינר?


כל הזמנים הם GMT +2. הזמן כעת הוא 00:53.

מופעל באמצעות VBulletin גרסה 3.8.6
כל הזכויות שמורות ©
כל הזכויות שמורות לסולל יבוא ורשתות (1997) בע"מ