محمد رضایی

اجرای افکت پس از رسیدن اسکرول

5 پست در این موضوع قرار دارد

با سلام , میخواستم در داخل سایتم قسمتی رو طراحی کنم و داخل از قسمت 3 Div ایجاد کنم که به طور Defult غیب باشن و وقتی که اسکرول بهشون رسید دونه دونه با با فاصله 1 ثانیه fadeIn بشن .

مثال :

1 قسمت اصلی و 3 قسمت زیرمجموعه داریم :


<div class="fade-div">
<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>
</div>

که وقتی که کاربر به قسمت fade-div رسید , div های داخلش با فاصله 1 ثانیه ظاهر بشند ( یعنی div1 همون ثانیه , div2 1 ثانیه بعد و div3 هم 2 ثانیه بعد از رسید به قسمت fade-in )

ممنون میشم راهنمایی کنید :wub:

0

به اشتراک گذاری این پست


لینک به پست

راهنمایی می خواهید یا کد آماده؟

من راهنمایی می کنم خودتون باهاش درگیر شید و بسازید

اولا که با css خاصیت display:none بهشون بدید

بعد با


var position = $(".fade-div").position();
var top_position = position.top;

فاصله دایو را تا ابتدای صفحه حساب کنید

و با اسکریپتی شبیه به

http://jsfiddle.net/fakhar/9PcmV/

چیزی که می خواهید رو بسازید

(نمونه ی آماده کاری که می خواهید بکنید رو هم دارم ولی نمی گذارم که بجای کپی و پست با کدها درگیر بشید و چیزی که لازم دارید رو بسازید)

3

به اشتراک گذاری این پست


لینک به پست

بسیار ممنون , بسیار کمک کرد و تونستم با customizeکردن sticky menu طراحیش کنم .

در ضمن من هیچ وقت کد آماده نمیخوام , فقط یک نخ ( راهنمایی کوچولو ) میخوام که مسیرو پیدا کنم

بسیار ممنون

1

به اشتراک گذاری این پست


لینک به پست

خوب ! حالا یک سوال دیگه پیش میاد :P !

بنده دقیقا کاریو میخواستم تونستم انجام بدم اما افکتیو که میخواستم نتونستم !

الان اگر کاربر به دیو fade-div برسه , دیو های داخلش به ترتیب fadeIn میشن .

حالا بنده میخوام یک افکت خوشگل تر مثل سایت ایران هاست بدم

اینم سایتش

http://design.hostiran.net/

منم افکت 4 تا دایره توش رو میخوام ! همین ...

خیلی ممنون

0

به اشتراک گذاری این پست


لینک به پست

با افکت animate می تونید خاصیت اینکار را بکنید با خاصیت های css هم می تونید فرق چندانی هم با هم ندارند

فرصت شد یک نمونه براتون می گذارم

1

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری