אני מנסה ליצור אפקט blur באתר שאני מפתח- ולצורך העיניין הגדרתי תמונת רקע ל-body שהיא בfixed. ועל כל אלמנט (div) שאני רוצה ליצור את האפקט הגדרתי תמונת רקע גם ב-fixed. האלמנטים האלו צריכים להיות בגודל קבוע, ולכן אם התוכן לא נכנס בצורה מלאה לאלמנט הגדרתי עליהם גם overflow:auto. הבעיה היא שהרקע על האלמנט לא נשאר קבוע במידה שהחלון והאלמנט נגללו שניהם (מצורפות תמונה להמחשה)

 

 

בדוגמא עצמה זה קורה גם כשהחלון (body) לא נגלל אלא מספיק שרק האלמנט נגלל- באתר שאני מפתח זה קורה רק כשגם האלמנט (ה-div) וגם החלון נגללו (לא יכול לתת קישור לאתר כי הוא כרגע מקומית על המחשב שלי)

http://www.bootply.com/WFoyvePw75

ניסיתי לשנות את ה-background-attachment לscroll או local אבל זה לא נותן את האפקט הרצוי.

 

ב-firefox הכל עובד כמו שצריך.. אני לא מבין למה כרום עושה לי בעיות. אפילו IE (!) מציג את זה כמו שצריך.

 

יש למישהו עצות?

נערך 2015 בדצמבר 99 שנים על-ידי gkman

מצאתי פתרון- להוסף div נוסף בתוך ה-div הראשון ולתת לו את ה-overflow: auto.

אם למישהו יש פתרון יותר טוב אני עדיין אשמח לשמוע.