طراحی یک صفحه با نرم افزار Macromedia Dreamweaver 8 به کمک جاوا اسکریپت

[neopersia]

ببخشید دیر رسیدم.
اول اینو بگم کهقبلاً فراموش کرده بودم:
window.onload همون <" "=body onload>خودمونه فقط یه کم تر و تمیز تره!

اگر منظورتون فقط متن هست که در صورت غیر فعال بودن جاوا اسکرپت نمایش داده نشه به نظرم راهش اینه که متن رو با جاوا اسکرپت بنویسید. یعنی متد onload رو اینطوری بنویسید:

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

بعد متن تو div با آی دی my_marquee رو حذف کنید. اینطوری اگر جاوا اسکرپت غیر فعال باشه (به هر دلیلی) تو سلول وسط جدول چیزی نمایش داده نمیشه.
اگر هم میخواید کل جدول در صورت غیر فعال بودن جاوا اسکرپت نمایش داده نشه راهش اینه که کدهای جدول رو با استفاده از متد document.write در جاوا اسکرپت بنویسید:

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

ولی من هنوز نفهمیدم این کار برای چیه!

[Ship Storm]

neopersia جان واقعا ممنون

ولی من هنوز نفهمیدم این کار برای چیه!

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

فقط چند تا سوال دارم چون چند قسمتش برام نامفهمومه و مطمئا استاده سوال میپرسه این چکار میکنه و اون چکار میکنه:

<span id="my_marquee" style="position:relative; z-index:-10"></span>

Span کارش چیه؟ Span چی هستش؟
z-index:-10 یعنی چی؟

&raquo; Speed Down &raquo;

&raquo رو چجوری اضافه کردی ؟چه دکمه ای رو زدید؟

<table border="1" cellpadding="0" cellspacing="0">

cellpadding یعنی چی؟

marquee_interval = setInterval(Move, 10);

marquee فقط یک اسم هستش درسته؟ بخوایم عوضش کنیم که مشکلی ایجاد نمیشه؟

document.getElementById('my_marquee').innerHTML = 'متن مورد نظر';

innerHTML یعنی چی و کارش چیه؟
چرا getElementById کردید؟

document.getElementById("my_marquee").style.right = r + 'px';

r + 'px' یعنی هر دفعه به Right اون px رو اضافه کن دیگه درسته؟
اونوقت شما px رو اومدی تو :

<style type="text/css">
th {
cursor:pointer;
padding:10px;
background:#eee;
/* width:200px; */
}
</style>

تعریف کردید؟

ممنون میشم یه توضیحی هم روی این قسمت بدیدکه چجوری نوشتیدش
اصلا این رو خودتون تایپ کردید یا به روشی دیگه این رو گذاشتید اینجا

var r = -200;
var i = 1;
function Move() {
if(r > 200) {
r = -200
} else if (r < -200) {
r = 200
} else {
r += i
}

var r = -200; چرا -200 شده؟ و سایر متغییر ها


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

[neopersia]

مثل اینکه کد اشتباهی رو انتخاب کردید. کدی که تو پست شماره 6 نوشتم کامله و کار میکنه از هشون هم ساده تره!

Span کارش چیه؟ Span چی هستش؟

در هر حال span هیچی نیست! فقط یک المنت از نوو اینلاین هست که برای اختصاص یک سری ویژگیهای css و یا بعضی از صفات عمومی مثل lang و id به یه قسمت از متن (یا مجموعه ای از یک سری المنتهای اینلاین دیگه) استفاده میشه. من ازش استفاده کردم و بهش یک id دادم تا بتونم قسمت مربوط به متن متحرک رو با جاوا اسکرپت از طریق همون id کنترل کنم.

z-index:-10 یعنی چی؟

ترتیب نمایش المنتهایی رو که روی هم قرار میگیرن مشخص میکنه. البته المنتها باید به صورت absolute یا relative موقعیت دهی شده باشن. به این ترتیب که هر المنتی که z-index بیشتری داره المنتهای زیر خودش رو میپوشونه!

overflow:hidden هم کاری میکنه که متنی که موقعیتش خارج از منطقه سلول وسطی هست مخفی بشه.

&raquo رو چجوری اضافه کردی ؟چه دکمه ای رو زدید؟

دکمه ای رو نزدم فقط همون کد ;raquo & رو نوشتم و مرورگر کاراکتر مربوط به اون کد رو نشون میده!

cellpadding یعنی چی؟

شناسه cellpadding مشخص میکنه که محتوای هر سلول از دیواره داخل سلول چقدر باید فاصله بگیرن!
شناسه cellspacing مشخص میکنه که سلولهای جدول چه مقدار باید با هم فاصله داشته باشن!

marquee فقط یک اسم هستش درسته؟ بخوایم عوضش کنیم که مشکلی ایجاد نمیشه؟

آره فقط یه اسمه. میشه عوضش کرد ولی باید حواستون باشه که اگه عوض کردید همه اسمهای مشابه رو عوض کنید وگرنه کار خراب میشه. راسی تو این مورد marquee_interval اگه کلاً اسم رو هم حذف کنید مشکلی پیش نمیاد چون ازش استفاده نشده. فقط برای روز مبادا گذاشتم گفتم شاید بخواید اینروال رو غیرفعال کنید به درد بخوره!

innerHTML یعنی چی و کارش چیه؟

مشخصه دیگه! یه مقدار html رو به عنوان محتوای المنت انتخاب شده قرار میده.

چرا getElementById کردید؟

برای اینکه بتونم المنتی رو که میخوام روش کار کنم انتخاب کنم. بااخره با یه روش و مشخصه ای باید به جاوا اسکرپت حالی کنیم که رو کدوم المنت قرار کار کنه

r + 'px' یعنی هر دفعه به Right اون px رو اضافه کن دیگه درسته؟

تو اون قسمت با استفاده از جاوا اسکرپت یک ویژگی css به المنت اختصاص داده میشه. چون مقدار ویژگی right باید عدد + واحد باشه مثلاً 12px باید هر دفعه که با جاوا اسکرپت عددی رو به این ویژگی اختصاص میدیم واحدش رو هم مشخص کنیم.

ممنون میشم یه توضیحی هم روی این قسمت بدیدکه چجوری نوشتیدش
اصلا این رو خودتون تایپ کردید یا به روشی دیگه این رو گذاشتید اینجا

منظورتونو متوجه نشدم

var r = -200; چرا -200 شده؟ و سایر متغییر ها

چون میخواستم متن از خارج از محدوده قابل رویت شروع به حرکت کنه.مقدار پیشفرض right صفر هست و -200 یعنی متن به مقدار 200 پیکسل نسبت به موقعیت پیش فرضش در سمت چپ نمایش داده بشه. چون عرض مجدوده قابل روین 200 پیکسل هست و عرض متن متحرک هم 200 در نظر گرفتم وقتی که مقدار ویژگی right المنت بین -200 و +200 باشه همه متن و یا قسمتی از اون قابل مشاهده هست در غیر این صورت متن خارج از دید قرار داره و باید اسکرپت براش طوری مقدار دهی کنه که وارد بشه
البته خوب من از right استفاده کردم. میشه از left هم استفاده کرد فقط یه مقدار باید عدد ها رو جابجا کنی.

کلیت کار اینه که اول به متن متحرک مقدار right رو -200 دادم تا کل متن در سمت راست خارج سلول وسط قرار بگیره. بعدش با selinterval هر 10 میلی ثانیه به مقدار i به right اضافه میشه و در نتیجه به نظر میرسه که متن به سمت چپ حرکت میکنه. وقتی هم که فاصله متن نسبت به موقعیت اصلیش (وقتی که right مساوی 0 هست) به اندازه عرض متن یعنی +200 رسید مشخصه که کل متن از کادر خارج شده برای همین دوباره موقعیت اولیه -200 رو بهش میدم تا یه دور دیگه بره سمت راست کادر و شروع به حرکت کنه.
اولش میخواستم با تغییر زمان اینتروال سرعت متن رو تغییر بدم که زیاد قدرت مانور نداشت. بعدش برای تغییر سرعت تعداد پیکسلی رو که متن در هر دور اینتروال باید جابجا بشه با متغیر i وارد کردم. یعنی هر بار که سرعت زیاد میشه مثلاً به جای اینکه متن هر 10 میلی ثانیه 1 پیکسل به چپ حرکت کنه، 2 پیکسل حرکت میکنه و به نظر میاد سرعتش بیشتر شده.

راستی متغیرها رو هم خارج از تابع تعریف کردم تا حالت گلوبال داشته باشن و بشه اونها رو با onclick تغییر داد

---------------------------------------------------
گذشته از همه این حرفا هنوز نمیدونم روش بهتری هم برای انجام این کار وجود داره یا نه ولی مطمئنم اگه تو گوگل سرچ کنید موارد مشابه زیادی پیدا میکنید که شاید منطق بهتری داشته باشن.

[Ship Storm]

واقعا ممنون و یه دنیا تشکر بابت این همه زحمتی که انداختم گردنت و وقتتون رو گرفتم
پس پست 6 تکمیل شده همه این هاست

تو قسمت :

<style type="text/css">
th {
cursor:pointer;
padding:10px;
background:#eee;
}

که گفتید متوجه نشدید منظور من رو منظورم این بود که این تکه کد رو خودتون نوشتید و یا با استفاده از Design این کد به Surce برنامه اضافه شده؟
مثلا خودتون بک گراند رو برابر background:#eee قرار دادید یا اینکه مثلا در Design کاری کردید که این کد خود به خود اینجا بصورت اتوماتیک اضافه شده

position:relative

کارش چیه؟ دقیق متوجه نشدم


پس خط :

marquee_interval = setInterval(Move, 10);

اضافه نوشته شده و کاربردی فعلا نداره؟

.container

یعنی چی و کاربردش چیه؟نا آشناست برام

واقعا ممنون

[neopersia]

خوب من اصلاً تو قسمت Design کار نمیکنم! ولی میدونم که میشه از اون طریق هم این خواص رو به المنت داد.

کار position: relative هم اینه که اجازه میده تا محل نمایش المنت مربوطه رو نسبت به موقعیت فعلی اون تغییر بدیم. برای اینکه ویژگی right رو بشه تغییر داد نیاز داشتیم که موقعیت دهی المنت رو به صورت نسبی یا همون relative تعیین کنیم.

در ضمن همه این که زیادی نیست فقط هندل تابع اضافیه:

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

یعنی میتونی به جای کد بالا این رو بنویسی:

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

.container هم یه کلاس هست که من برای اون المنت انتخاب کردم تا با استفاده از اون بتونم خواص css مورد نظرم رو به اون المنت اختصاص بدم (اسمش هم مهم نیست و میشه تغییرش داد)