ماژول کناری نمونه

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد.

صفحه نخست

صفحات

ویژگی ها

افزونه ها

آموزش ها

ماژول کناری نمونه

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد.
اسکرول تمام صفحه
ویژگی اسکرول صفحه توسط اسکریپتی که در آدرس زیر یافت می شود ساخته شده است: https://github.com/julianlloyd/scrollReveal.js این اسکریپت به شما اجازه افزودن "data-scroll-reveal" به عناصر HTML برای ساختن اسکرول متحرک را می دهد. پیشنهاد ما اینست که به DIV یا SPAN اضافه شود. DIV فقط می تواند حرکت دهد در حالیکه تگ SPAN برای محو کردن آن است. وقتی شما کد را به DIV اضافه کردید، صفحه را دوباره لود کنید و به پایین اسکرول کنید و می بینید که متحرک می شود. البته این حرکت یک بار انجام خواهد شد تا زمانی که شما صفحه را دوباره لود کنید. ویژگی بزرگ این اسکریپت اینست که می توانید از انگلیسی ساده برای توضیح اینکه چطور عناصر HTML میخواهد متحرک شود استفاده کنید.

نمونه آن در عمل ( اگر چیزی ندیدید دوباره صفحه را لود کنید):

ورود از چپ و رفتن 50px به بالا در 1.33 ثانیه
ورود از پایین بعد از یک ثانیه
2.5 ثانیه صبر کردن و سپس 100 پیکسل باز شدن


کد استفاده شده برای بالا:

<div data-scroll-reveal="enter left and move 50px over 1.33s"> Enter from the left and move up 50px in 1.33 seconds. </div>

<div data-scroll-reveal="enter from the bottom after 1s"> Enter from the bottom after 1 second. </div>

<div data-scroll-reveal="wait 2.5s and then ease-in-out 100px"> Wait 2.5 seconds and then ease-in-out 100px. </div>

کاربرد:

برای بحث و اطلاعات بیشتر در مورد این ویژگی به اینجا مراجعه کنیدhttps://github.com/julianlloyd/scrollReveal.js
  • fa-IR
  • English (UK)