سوال در مورد محاسبه طول اسکرول بار

evil_gates

اين نيز بگذرد ...
سلام دوستان
من یه صفحه دارم که با CSS خصوصیت height تگ body رو معادل 1000px قرار دادم. قاعدتاً وقتی صفحه رو تو مرورگر اجرا می کنم اسکرول بار خواهم داشت.

من میخوام طول اسکرول بار رو بدست بیارم طوری که بدونم وقتی اسکرول صفحه من به انتها رسید مقدار جابجایی اون چقدر بوده.

با دستور زیر تو جی کوئری میشه مقدار موقعیت فعلی (مقدار جابجایی اون رو از ابتدای صفحه) اسکرول بار رو بدست آورد.

کد:
[LEFT]var ScrollSize = $(window).scrollTop();[/LEFT]

من سعی کردم به محض بارگذاری صفحه، اول اسکرول بار رو به انتهای صفحه ببرم بعد مقدار جابجایی اسکرول بار رو بدست بیارم و بعد مجدداً اسکرول بار رو به ابتدای صفحه برگردونم.

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

کد:
[LEFT]$("html, body").animate({ scrollTop: 1000 }, 0);
var ScrollSize = $(window).scrollTop();
$("html, body").animate({ scrollTop: 0 }, 0);[/LEFT]

در این حالت مقدار موجود در متغیر ScrollSize برابر با مقدار زمانی هست که صفحه به انتها می رسه. مثلاً تو حالت maximize عدد بدست اومده میشه 250 . یا اگه اندازه پنجره مرورگر رو تغییر بدم و رفرش کنم عدد بدست اومده مثلا میشه 420

سوال من اینجاست

اولاً آیا در جاوا اسکریپت و خصوصاً کتابخانه جی کوئری دستور مشخصی یا تابعی وجود داره برای انجام این کار ؟!

دوم اینکه با هر بار تغییر اندازه پنجره مرورگر طبیعتاً طول اسکرول بار هم تغییر خواهد کرد پس باید مقدار متغیر هم تغییر کنه. مثلا تو مانیتور من اگه مرورگر در حداکثر اندازه ممکن باشه عدد بدست اومده میشه 250 و اگه تو حداقل اندازه ممکن باشه عدد بدست اومده میشه 951 .

مشکل اینجاست وقتی یک بار این دستور اجرا میشه و مثلا عدد 250 رو بر میگردونه حالا اگه پنجره resize بشه مقدار موجود در متغیر همچنان 250 و حتما باید صفحه رفرش بشه تا مقدار جدید جایگزین قبلی بشه.

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

ممنون از دوستانی که راهنمایی می کنند. :rose:

اینم نمونه کدهای صفحه من:
کد:
[LEFT]<html>
	<head>
		<title> Scroll Event in jQuery </title>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
		<script>
			$(document).ready(function() {
				$("html, body").animate({ scrollTop: 1000 }, 0);
				var ScrollSize = $(window).scrollTop();
				$("html, body").animate({ scrollTop: 0 }, 0);
				
				$(window).scroll(function(){
					var TopSize = $(window).scrollTop();
					$('.text').text(TopSize);
				});
			});
		</script>
		<style>
			body { height:1000px; }
			.text { position: fixed; top:10px; left:10px;}
		</style>
	</head>
	<body>
		<div class="text">
			Scroll size
		</div>
	</body>
</html>[/LEFT]
[JSS][/JSS]
 

farik

Well-Known Member
باسلام..
نمیدونم مشکل حل شده یا نه..حقیقت اتفاقی بعد از مدت ها سری زدم به اینحا....چیزی که میخواین باید با استفاده از bind رویداد resize مربوط به window رو با تابع مد نظرتون مقدار دهی کنین که مقدار اسکرول تاپ رو به شما بده...
موفق باشید..
 

جدیدترین ارسال ها

بالا