Parallax Scrolling
nazanin در 18/01/13
با استفاده از Parallax Scrolling قادر خواهید بود هر section از صفحه اصلی را به صورت صفحات مجزا نمایش دهید که با اسکرول کردن به صورت پارالکس تغییر خواهند کرد.
برای دیدن پیش نمایشی از Parallax Scrolling می توانبد روی لینک کلیک کنید.
https://www.jqueryscript.net/demo/jQuery-Plugin-To-Create-Stacked-One-Page-Scrolling-Effect-Stackpage
1. فایل زیر را دانلود کنید
2. تمام section های صفحات وب (صفحه اصلی) را بصورت زیر جدا کنید.
هر section باید کلاس page را داشته باشد.
<"div class="wrap>
<"div id="page-1" class="page>
<"div class="containe>
Content 1
</div>
</div>
<"div id="page-2" class="page>
<"div class="container>
Content 2
</div>
</div>
<"div id="page-3" class="page>
<"div class="container>
Content 3
</div>
</div>
</div>
3. در فایل css هم کد زیر را وارد کنید.
sp-fixed.
}
;position: fixed
;top: 0
;left: 0
{
4. فایل های زیر رو در انتهای تگ <body> قرار دهید
<script src="http://code.jquery.com/jquery-3.0.0.min.js"></script>
<script src="js/main.js"></script>
<script src="js/jquery.stackpage.js"></script>