פינות מעוגלות ב CSS - הוסטס

liorclub · 06-10-10, 03:38

שלום,

אשמח לדעת על הדרך העדיפה ביותר לעשות פינות מעוגלות לדיב מסויים

העדיפות היא PURE CSS ללא שימוש בתמונות לפינה או תמונת רקע

תודה לעוזרים

**IgalSt** · 06-10-10, 10:05

אחלה שמביא לך את הקוד שאתה צריך:
http://border-radius.com/

תקבל בעיקרון 3 שורות קוד שעושות בערך אותו הדבר.

דוגמא:

HTML קוד:

-webkit-border-radius:6px;  /*WebKit (Chrome and Others)*/
-moz-border-radius:6px; /*Mozilla (FF)*/
border-radius:6px;  /*CSS 3 Standart*/

צריך את כל ההגדרות הללו כדי לעגל פינות בצורה זהה בכל הדפדפנים.
מאחר ו-CSS3 עדיין מוגדר כ"טיוטה", כל דפדפן רשאי לטפל בנושא כראות עיניו.
לכן מגדירים הגדרה שונה לכל אחד מם ובסוף עושים overwrite להגדרה הרשמית שתהיה בסופו של דבר כאשר התקן יאושר.

שים לב שרק IE9 ומעלה יעגל פינות.
כדי לעגל פינות בגירסאות קודמות יש צורך בחלופון כמו עיגול פינות ע"י JS (אני ממליץ על זה)

liorclub · 06-10-10, 11:54

הגעתי לזה, אבל הבעיה היא עם אקספלורר שאלו רוב הגולשים

אני אנסה עם JS.
תודה על העזרה,

אשמח לקבל עוד הצעות

Erez | TrustMedia.co.il · 06-10-10, 14:05

http://www.internet-israel.com/inter...5%D7%A8%D7%A8/

יש שם משהו שקוראים לו PIE שמאפשר פינות מעוגלות באקספלורר גם

**IgalSt** · 07-10-10, 09:45

ציטוט:

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

http://www.internet-israel.com/inter...5%D7%A8%D7%A8/

יש שם משהו שקוראים לו PIE שמאפשר פינות מעוגלות באקספלורר גם

בתוך קובץ ה-PIE.htc יש קוד JS שככל הנראה מבצע פעולות מאוד דומות למה שהקוד של JQUERY מבצע.

אני העדפתי את הפתרון שהצעתי קודם לכן מאחר ופלאגאין ה-JQUERY יודע לנתח בעצמו את ה-CSS ובתנאי שהוא מוצא שם את הפקודות של border-radious + מדובר בדפדפן IE8 ומטה, הוא מבצע מעגל פינות.

intercooler3819 · 09-10-10, 12:24

תסתכל פה http://.co.il/

אני לא זוכר איך עשיתי את זה אתה מוזמן לחטט בקוד..

AlmogBaku · 13-10-10, 01:49

יש אפשרות לעגל בJS- אבל אם תשאל אותי: מי שמתשמש ב IE בעיה שלו. אלא אם מדובר בעיצוב הסיסי של האתר(לא וודג'טים)- אז צריך להשתמש בטכניקת תמונות. js פשוט לא עושה את זה מספיק טוב..

astricks · 13-10-10, 06:18

baku הלוואי וזאת הייתה גישה רלוונטית..
הציעו לך פה pie.htc - הפיתרון הכי טוב לדעתי. הוא מחקה, משלים מספר אפקטים שלא נתמכים בIE בגלל שהוא לא תומך CSS3. הוא יותר מהיר מפיתרונות jQuery (על פי בנצ'מרקים, תריץ חיפוש) ובטח שיותר אמין (המון צרות הוא עושה בשילוב עם סקריפטים נוספים וכדומה).
יש עוד מלא אופציות רק תחפש בגוגל css3 ie בהצלחה

Hagaibl · 13-10-10, 08:45

לסיכום, יש לך 2 אופציות:
1. שימוש pie.htc
2. jQuery.

מומלץ pie.htc

**IgalSt** · 13-10-10, 09:15

ציטוט:

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

baku הלוואי וזאת הייתה גישה רלוונטית..
הציעו לך פה pie.htc - הפיתרון הכי טוב לדעתי. הוא מחקה, משלים מספר אפקטים שלא נתמכים בIE בגלל שהוא לא תומך CSS3. הוא יותר מהיר מפיתרונות jQuery (על פי בנצ'מרקים, תריץ חיפוש) ובטח שיותר אמין (המון צרות הוא עושה בשילוב עם סקריפטים נוספים וכדומה).
יש עוד מלא אופציות רק תחפש בגוגל css3 ie בהצלחה

אתה יכול להסביר למה הוא יותר מהיר מ-jquery?
על סמך מה קבעת את זה?

06-10-10, 03:38	# 1
liorclub חבר על מיני פרופיל תאריך הצטרפות: Jan 2007 גיל: 39 הודעות: 756	פינות מעוגלות ב CSS שלום, אשמח לדעת על הדרך העדיפה ביותר לעשות פינות מעוגלות לדיב מסויים העדיפות היא PURE CSS ללא שימוש בתמונות לפינה או תמונת רקע תודה לעוזרים __________________ ליאור

06-10-10, 10:05	# 2
IgalSt מנהל פורום, עסק רשום מיני פרופיל תאריך הצטרפות: Oct 2005 מיקום: המרכז גיל: 37 הודעות: 1,432	אחלה שמביא לך את הקוד שאתה צריך: http://border-radius.com/ תקבל בעיקרון 3 שורות קוד שעושות בערך אותו הדבר. דוגמא: HTML קוד: -webkit-border-radius:6px; /WebKit (Chrome and Others)/ -moz-border-radius:6px; /Mozilla (FF)/ border-radius:6px; /CSS 3 Standart/ צריך את כל ההגדרות הללו כדי לעגל פינות בצורה זהה בכל הדפדפנים. מאחר ו-CSS3 עדיין מוגדר כ"טיוטה", כל דפדפן רשאי לטפל בנושא כראות עיניו. לכן מגדירים הגדרה שונה לכל אחד מם ובסוף עושים overwrite להגדרה הרשמית שתהיה בסופו של דבר כאשר התקן יאושר. שים לב שרק IE9 ומעלה יעגל פינות. כדי לעגל פינות בגירסאות קודמות יש צורך בחלופון כמו עיגול פינות ע"י JS (אני ממליץ על זה) __________________ יגאל סטקלוב Igal Steklov Slides מה השעה? טרקלין דן טרמינל 1

06-10-10, 11:54	# 3
liorclub חבר על מיני פרופיל תאריך הצטרפות: Jan 2007 גיל: 39 הודעות: 756	הגעתי לזה, אבל הבעיה היא עם אקספלורר שאלו רוב הגולשים אני אנסה עם JS. תודה על העזרה, אשמח לקבל עוד הצעות __________________ ליאור

06-10-10, 14:05	# 4
Erez \| TrustMedia.co.il עסק רשום [?] מיני פרופיל תאריך הצטרפות: Jul 2008 הודעות: 1,854	http://www.internet-israel.com/inter...5%D7%A8%D7%A8/ יש שם משהו שקוראים לו PIE שמאפשר פינות מעוגלות באקספלורר גם __________________

09-10-10, 12:24	# 6
intercooler3819 חבר וותיק מיני פרופיל תאריך הצטרפות: Jul 2008 הודעות: 1,056	תסתכל פה http://.co.il/ אני לא זוכר איך עשיתי את זה אתה מוזמן לחטט בקוד.. __________________


	ההרשמה לפורום נפתחה - אפשרות רישום לכל אימייל (דומיינים פרטיים, gmail, הוטמייל..)!

13-10-10, 01:49	# 7
AlmogBaku חבר וותיק מיני פרופיל תאריך הצטרפות: Nov 2007 מיקום: מודיעין הודעות: 1,022	יש אפשרות לעגל בJS- אבל אם תשאל אותי: מי שמתשמש ב IE בעיה שלו. אלא אם מדובר בעיצוב הסיסי של האתר(לא וודג'טים)- אז צריך להשתמש בטכניקת תמונות. js פשוט לא עושה את זה מספיק טוב..

13-10-10, 06:18	# 8
astricks חבר בקהילה מיני פרופיל תאריך הצטרפות: Oct 2005 גיל: 35 הודעות: 95	baku הלוואי וזאת הייתה גישה רלוונטית.. הציעו לך פה pie.htc - הפיתרון הכי טוב לדעתי. הוא מחקה, משלים מספר אפקטים שלא נתמכים בIE בגלל שהוא לא תומך CSS3. הוא יותר מהיר מפיתרונות jQuery (על פי בנצ'מרקים, תריץ חיפוש) ובטח שיותר אמין (המון צרות הוא עושה בשילוב עם סקריפטים נוספים וכדומה). יש עוד מלא אופציות רק תחפש בגוגל css3 ie בהצלחה

13-10-10, 08:45	# 9
Hagaibl משתמש - היכל התהילה מיני פרופיל תאריך הצטרפות: Jul 2010 הודעות: 214	לסיכום, יש לך 2 אופציות: 1. שימוש pie.htc 2. jQuery. מומלץ pie.htc __________________ בברכה, חגי בלוך גדות.

חברים פעילים הצופים באשכול זה: 1 (0 חברים ו- 1 אורחים)