gahannama
New Member
من خودم جاوا اسكريپت ياد ندارم و تازه شروع كردم به ياد گيري اون. از دوستان خواهشمندم در اين آموزش جاوا اسكريپت كه از يك سايت خارجي گرفتم كمكم كنند تا مراحل نوشتن يك برنامه به جاوا اسكريپت و كد هايي كه در اون مينويسند را بهتر بفهمم و ياد بگيرم.
با تشكر
_______________
در اين آموزش ميخواهيم ياد بگيريم كه چگونه يك جهبه متن متحرك ايجاد كنيم.
مراحل
1. يك متغير (pos) به منظور ذخيره موقعيت اسكرول جاري تعريف كنيد.
2. يك تابعي را بنويسيد كه مي خواهيم:
مقدار id (شناسه) اسكرول جعبه متن را بگيرد.
يك واحد از pos كم كند و مقدار pos را كه offsetHeight ميباشد را بررسي كند، كه بلندي آبجكت (شي) را نسبت به layout (صفحه بندي) جبران كند.
يك مقدار (value) بلندي جديد قرار بدهد كه در style object هاي جاوا اسكريپت بكار ميرود.
در پايان تابع ، خودش در زمان مورد نظر فراخواني شود.
كد HTML براي جعبه متن متحرك
كد HTML خيلي ساده است. همه ما مجبوريم تابع اسكرول را قرار بدهيم و لايه هاي مناسبي براي كادر متن تعريف كنيم.
ما به دو لايه تو در تو احتياج داريم:
يكي بوجود آوردن يك پنجره كوچك به منظور نمايش متن در آن
دوم داشتن محتوي متن متحرك
براي ايجاد افكت اسكرول اسكريپت ميخواهد مشخصات style.top لايه متحرك متن را بدست بگيرد. مشخصه سر ريز (overflow) لايه پنجره مانع خواهد شد تا محتوايي كه ماوراي مرزهاي لايه پنجره اي هست ديده شود.
براي شروع حركت ، ما تابع اسكرول را فرا ميخوانيم از داخل تگ <body> تا onLoad اجرا بشود.
ديدن نمونه
همانطور كه ميبينيد ايجاد كردن يك جعبه متن متحرك جاوااسكريپت خيلي ساده است. براي گذاشتن كامنتتان نترسيد، پيشنهادات يا تصحيحات.
_______________________________________
اين متن اون آموزشي بود كه خودم ترجمش كردم.
حالا سوالاتي كه از اهل فن دارم:
getElementById فكر ميكنم يكي از فرمان هاي جاوااسكريپت باشه كه به اون شي اي كه داخل كد هاي html ميباشد و id آن هم نام با id تعريف شده در اين جا ميباشد اشاره ميكنه يعني :scrolltextlayer
درسته؟
و دنباله ي اون يك if آورده كه منظورشو نميفهمم چي ميگه. دوستان اگه لطف كنن يكم توضيح بدن.
با تشكر فراوان
با تشكر
_______________
در اين آموزش ميخواهيم ياد بگيريم كه چگونه يك جهبه متن متحرك ايجاد كنيم.
مراحل
1. يك متغير (pos) به منظور ذخيره موقعيت اسكرول جاري تعريف كنيد.
2. يك تابعي را بنويسيد كه مي خواهيم:
مقدار id (شناسه) اسكرول جعبه متن را بگيرد.
يك واحد از pos كم كند و مقدار pos را كه offsetHeight ميباشد را بررسي كند، كه بلندي آبجكت (شي) را نسبت به layout (صفحه بندي) جبران كند.
يك مقدار (value) بلندي جديد قرار بدهد كه در style object هاي جاوا اسكريپت بكار ميرود.
در پايان تابع ، خودش در زمان مورد نظر فراخواني شود.
JavaScript Function for the Scrolling Text Box
کد:
var pos = 100;
function Scroll(){
obj=document.getElementById('scrolltextlayer');
pos -=1;
if(pos < 0 - obj.offsetHeight+130) return;
obj.style.top=pos;
window.setTimeout( "Scroll();" , 30);
}كد HTML خيلي ساده است. همه ما مجبوريم تابع اسكرول را قرار بدهيم و لايه هاي مناسبي براي كادر متن تعريف كنيم.
ما به دو لايه تو در تو احتياج داريم:
يكي بوجود آوردن يك پنجره كوچك به منظور نمايش متن در آن
دوم داشتن محتوي متن متحرك
براي ايجاد افكت اسكرول اسكريپت ميخواهد مشخصات style.top لايه متحرك متن را بدست بگيرد. مشخصه سر ريز (overflow) لايه پنجره مانع خواهد شد تا محتوايي كه ماوراي مرزهاي لايه پنجره اي هست ديده شود.
براي شروع حركت ، ما تابع اسكرول را فرا ميخوانيم از داخل تگ <body> تا onLoad اجرا بشود.
کد:
<html>
<head>
<title>A JavaScript Scrolling Text Box</title>
<script language="JavaScript" type="text/javascript">
var pos = 100;
function Scroll(){
obj=document.getElementById('scrolltextlayer');
pos -=1;
if(pos < 0 - obj.offsetHeight+130) return;
obj.style.top=pos;
window.setTimeout( "Scroll();" , 30);
}
</script>
</head>
<body onLoad="Scroll();">
<div id="windowlayer" style="position:relative; width:200px; height:150px; overflow:hidden; border: 1px solid #ccc;">
<div id="scrolltextlayer" style="position:absolute; width:180px; height:130px; top:100px;">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras hendrerit mauris eget nunc. Proin dapibus eros in quam. Nunc nulla nunc, nonummy auctor, scelerisque non, cursus et, leo. </p>
<p> Nullam egestas nulla feugiat orci. Integer lorem sapien, ullamcorper dapibus, cursus eu, sagittis vel, dolor. Mauris tincidunt, magna in congue bibendum, sem quam tincidunt tortor, in consectetuer turpis odio a libero. </p>
<p>Suspendisse viverra lectus et nunc. Nam elementum. Nam varius, magna a pretium feugiat, lacus nisi egestas enim, quis blandit nisi enim ut justo. In sit amet mi. </p>
<p>Sed cursus sagittis pede. Morbi nec dolor in arcu interdum consectetuer. Vivamus vel orci quis purus tristique vehicula. Curabitur eleifend nisi quis magna viverra laoreet. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. </p>
<p><a href="javascript:pos=100; Scroll();">Scroll again</a></p>
</div>
</div>
</body>
</html>همانطور كه ميبينيد ايجاد كردن يك جعبه متن متحرك جاوااسكريپت خيلي ساده است. براي گذاشتن كامنتتان نترسيد، پيشنهادات يا تصحيحات.
_______________________________________
اين متن اون آموزشي بود كه خودم ترجمش كردم.
حالا سوالاتي كه از اهل فن دارم:
getElementById فكر ميكنم يكي از فرمان هاي جاوااسكريپت باشه كه به اون شي اي كه داخل كد هاي html ميباشد و id آن هم نام با id تعريف شده در اين جا ميباشد اشاره ميكنه يعني :scrolltextlayer
درسته؟
و دنباله ي اون يك if آورده كه منظورشو نميفهمم چي ميگه. دوستان اگه لطف كنن يكم توضيح بدن.
با تشكر فراوان
