چگونگی Rol Over شدن جدول در کد نمونه

adame_haji

adame_haji

Member
آقا جريان چي چيه ؟

اين کد Html رو تو Dream Weaver کپي کنيد و اجراش کنيد


کد: 
<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>جريان چي چيه ؟</title>
</head>

<body>

						  <table class="pbt" cellpadding="3" cellspacing="1" align="center" width="130" style="font-family: Tahoma, Verdana, Arial; FONT-SIZE: 10px" height="106">
                             <tr>
							    <td class="pttl" style="background-color: #00626a" align="center" height="12" width="122">
							    <div style="background-color: #346030">
							    &nbsp;</div>
                                </td>
							 </tr>
                             <tr style="background-color: #DCEAEB;" onmouseover="this.style.background='#ABC7CC'" onmouseout="this.style.background='#DCEAEB'" bgColor=#405a7e>
                                <td height="1" width="122" align="right" dir="rtl">
                                    <div align="right"><img src="file:///F:/photoshop/hadisenynava.com/www/Images/tgb.gif" border="0" width="5" height="5" align="middle">&nbsp;
                                    تاریخچه هیئت</div></td>
							 </tr>
							 <tr style="background-color: #DCEAEB;" onmouseover="this.style.background='#ABC7CC'" onmouseout="this.style.background='#DCEAEB'" bgColor=#405a7e>
                                <td height="1" width="122" align="right" dir="rtl">
                                    <div align="right"><img src="file:///F:/photoshop/hadisenynava.com/www/Images/tgb.gif" border="0" width="5" height="5" align="middle">&nbsp;<span lang="fa">برنامه 
                                    های هفتگی</span></div></td>
							 </tr>
							 <tr style="background-color: #DCEAEB;" onmouseover="this.style.background='#ABC7CC'" onmouseout="this.style.background='#DCEAEB'" bgColor=#405a7e>
                                <td height="12" width="122" align="right" dir="rtl">
                                    <div align="right"><img src="file:///F:/photoshop/hadisenynava.com/www/Images/tgb.gif" border="0" width="5" height="5" align="middle">&nbsp;<span lang="fa">آوای 
                                    نینوا</span>
								    </div></td>
							 </tr>
							 <tr style="background-color: #DCEAEB;" onmouseover="this.style.background='#ABC7CC'" onmouseout="this.style.background='#DCEAEB'" bgColor=#405a7e>
                                <td height="12" width="122" align="right" dir="rtl">
                                    <div align="right"><img src="file:///F:/photoshop/hadisenynava.com/www/Images/tgb.gif" border="0" width="5" height="5" align="middle">&nbsp;<span lang="fa">در 
                                    قاب نینوا</span>
								    </div></td>
							 </tr>
							 <tr style="background-color: #DCEAEB;" onmouseover="this.style.background='#ABC7CC'" onmouseout="this.style.background='#DCEAEB'" bgColor=#405a7e>
                                <td height="12" width="122" align="right" dir="rtl">
                                    <div align="right"><img src="file:///F:/photoshop/hadisenynava.com/www/Images/tgb.gif" border="0" width="5" height="5" align="middle">&nbsp;<span lang="fa">نوا 
                                    خانه</span></div></td>
							 </tr>
							 <tr style="background-color: #DCEAEB;" onmouseover="this.style.background='#ABC7CC'" onmouseout="this.style.background='#DCEAEB'" bgColor=#405a7e>
                                <td height="12" width="122" align="right" dir="rtl">
                                    <div align="right"><img src="file:///F:/photoshop/hadisenynava.com/www/Images/tgb.gif" border="0" width="5" height="5" align="middle">&nbsp;<span lang="fa">شعر 
                                    نینوا</span></div></td>
							 </tr>
							 <tr style="background-color: #DCEAEB;" onmouseover="this.style.background='#ABC7CC'" onmouseout="this.style.background='#DCEAEB'" bgColor=#405a7e>
                                <td height="12" class="zdf" width="122" align="right" dir="rtl">
                                    <div align="right"><img src="file:///F:/photoshop/hadisenynava.com/www/Images/tgb.gif" border="0" width="5" height="5" align="middle">&nbsp;<span lang="fa">خبر 
                                    نامه</span></div></td>
							 </tr>
							 <tr style="background-color: #DCEAEB;" onmouseover="this.style.background='#ABC7CC'" onmouseout="this.style.background='#DCEAEB'" bgColor=#405a7e>
                                <td height="1" width="122" align="right" dir="rtl">
                                    <div align="right"><img src="file:///F:/photoshop/hadisenynava.com/www/Images/tgb.gif" border="0" width="5" height="5" align="middle">&nbsp;<span lang="fa">درباره 
                                    سایت </span> 
								    </div></td>
							 </tr>
							 <tr style="background-color: #DCEAEB;" onmouseover="this.style.background='#ABC7CC'" onmouseout="this.style.background='#DCEAEB'" bgColor=#405a7e>
                                <td height="1" width="122" align="right" dir="rtl">
                                    <div align="right"><img src="file:///F:/photoshop/hadisenynava.com/www/Images/tgb.gif" border="0" width="5" height="5" align="middle">&nbsp;<span lang="fa">تماس 
                                    با ما </span>
								    </div></td>
							 </tr>
						   </table>
			               
</body>

</html>

يه جدول باز ميشه که توش 3 تا رديف داره
با موس روي هر خونه که بري خونه اون روشن ميشه !!!!
چجوري اينجوري ميشه ؟
ببينيد من خودم ميتونم وقتي Mouse Over شد خونه روشن بشه ولي اين در حالتيه که روي نوشته اون خونه ماوست بره اما اون نمونه بالايي همزماني که ماوس روي باکس بره بکس روشن ميشه
اون حالتي که من بلدم اينه :

تو Front Page از منوي Format گزينه Dynamic HTML Effect رو انتخاب ميکنيم و باقي ماجرا
راستي اگه جوا دادي لطف کنيد و توي Dream Weaver بگيد چجوريه . چون ميخوام از Front Page دل بکنم

راستي 2 تا سوال ديگه هم داشتم
اين 2 تا دکمه رو چجوري بسازم :
[  انتخاب بعنوان صفحه خانگي ]
[  افزودن به ليست مورد علاقه  ]

سايت هست که بتونم از اين کد ها ازش بدست بيارم ؟

تو سايتي که ميخوام بسازم پاينش ميخوام بصورت رندم از يه آدرسي عکس لود کنه
يعني ميخوام 100 تا عکس توي سايتم بريزم و هر دفعه که يکي توي سايت مياد توي باکس کوچکي زير صفحه اصلي يدونه از اين عکسها رو ببينه
اين کار رو چجوري انجام بايد بدم
 
hossein_salehi

hossein_salehi

Member
توجه کنید !

دوست من این خط رو ببین :
<tr style="background-color: #DCEAEB;" onMouseOver="this.style.background='#ABC7CC'" onMouseOut="this.style.background='#DCEAEB'" bgColor=#405a7e>

بک گراند چی هست ؟ اینه ! background-color: #DCEAEB
خوب همین onMouseOver و onMouseOut رو واسه تگ tr نوشته - چه عیبی داره ؟
بعد این this که میبینی نوشته منظور همین تگ هست که درونشه.
یعنی اگه موس اومد روی تگ tr یا به عبارتی = محدوده ی این تگ - این کار رو بکن :
="this.style.background='#ABC7CC'"
یعنی یه استایلشو عوض کن - کدوم استایل ؟ = بک گراند
و onMouseOut="this.style.background='#DCEAEB'" هم واسه اینه که وقتی موس از روی تگ کنار رفت استایلش به حالت اول برگرده. ( اگه دقت کنی بک گراندش در حالت عادی و حالتی که موس کنار میره یکی هستش : #DCEAEB
---------------------------------------
برا رفتن به صفحه اصلی هم که باید لینک بدی به صفحه اصلیت - مشخصه - البته تو دریم ویور از تمپلت استفاده کن.
میدونم که اگه قرار باشه از تمپلت تو دریم استفاده کنی باید اونو بلد باشی. ( من تا آخر تابستون نمیرسم آموزش بزارم - به خاطر کنکور - اما بعدش قول میدم آموزش بزارم در مورد دریم )
کد اضافه به Favorites الان به خاطرم نیست - اما براتون میزارمش.
اگه میخوای هر دفه یه عکس لود شه از اون تعداد - باید از یکی از زبانهای داینامیک استفاده کنی - مثه ASP یا PHP یا ... با برنامه هایی مثه فرانت پیج و دریم و اینا نمیشه - این برنامه ها قرار نیست چیزی برا ما خلق کنند - قراره برای سریعتر شدن کارمون کمک کنند.
موفق باشید.
 
adame_haji

adame_haji

Member
داداش دمت گرم خیلی زحمت کشیدی
ولی میدونستم با کپی پیست کارم راه میفته ولی میخوام اگه یه موقع دترسی به این کدها نداشتم ببینم باید چیکار کنم ؟
میخواستم ببینم این کد ها بصورت دستور تو این برنامه ها وجود داره یا اینکه باید دستی ساخت

راجع به لینک هم فکر کنم منظورم رو نگرفتی . منظورم این بود که چجوری 2 تا لینک درست کنم یکی Favorites که فرمودی کدش رو بعدا گیر میاری و دیگری لینکی که وقتی روی اون کلیک کنی سایت ما بعنوان Homee page اون براوزر شناخته بشه
دمت گرم

یا علی
 
hossein_salehi

hossein_salehi

Member
تشکر!

دوست عزیز شما اگه توجه کنی همه تگهای HTML یه خصوصیت به نام Style دارند که میتونید از اون استفاده کنید -
یعنی با این خصیصه Style میتونید به هر خصوصیت آن تگ مورد نظر دسترسی داشته باشید.
در واقع زبان کمکی CSS به همین منظور ایجاد شده - تا همین نوع کارها رو راحت تر بتونید انجام بدید -
در مورد Favirites هم فایلی که براتون گذاشتم یه مثال هست که حرفه ای که کار شده برا این منظور.
در مورد صفحه اصلی درست تایپ نکردید که بدونم منظورتون چی هست ؟ آیا یه لینک میخواید تا به کسی بدید و اون تو سایت بزاره واسه لینک کردن به شما ؟ لطفا درست تایپ کنید!
موفق باشید.
 

پیوست ها

  • BOOKMARK.rar
    953 بایت · بازدیدها: 10
آخرین ویرایش:
adame_haji

adame_haji

Member
حسین جان دمت گرم بوک مارک رو متوجه شدم خیلی عالی بود

اما منظورم از اون لینک چیست .
اگه از Enternet Explorer استفاده میکنی از منوی tools گزینه Internet Option رو بزن
در صفحه باز شده شما میتوانید آدرس Home Page (صفحه خانگی ) رو تغییر دهید . برای مثال من هر موقع یه صفحه اینترنتی خالی باز میکنم سریع خودش این آدرس برام باز میشه http://www.google.com/intl/en/
چون من قبلا این آدرس رو برا هوم پیچ انتخاب کرده بودم
حالا من لینکی میخوام تو سایتم قرار بدم که بازدید کننده ای که از سایت من خوشش میاد دگیه لازم نباشه آدرس سایت من رو کپی کنه و تو Internet Option بره و Paste کنه . بلکه اگه روی اون لینک مخصوص کلیک کنه اتوماتیک این کار انجام میشه و از این به بعد هر موقع یه صفحه اینترنتی جدید باز میکنه اول سایت من تو صفحش لود میشه

راجع فایلهای Css مرجعی سراغ داری که بشه توش چیزای جالب بدست آورد
خودم مثلا یه Css دارم که وقتی تو صفحه میندازی ساعد رو میگه و اگه صبح باشه میگه صبح بخیر و اگه شب باشه میگه تا این موقع شب بیداری !!!!

یا علی
 
hossein_salehi

hossein_salehi

Member
Ok

دوست من اینم اونچه که میخواستی :
برات فایلشو گذاشتم.
توضیحات فایل رو اینجا برات میزارم :

style="cursor:hand" - changes the cursor to be a hand when over this html link. onclick="this.style.behaviour='url(#default#homepage)';this.setHomePage('http://elouai.com/bookmark-favorites.php');" - on the mouse click call the home page dialog, setting the home page to http://elouai.com/bookmark-favorites.php. - We set the image to a recognizable icon, one used by IE since 96% of the web uses IE. Border 0 to hide the outline that it is clickable. Set as homepage - Text to display.
کلیک کنید تا باز شود...

در مورد CSS هم باید تو فکرش باشی تا پیشرفت کنی - از اینکه 4 تا سایت من معرفی کنم فایده ای نداره - اون ساعت هم با JAVASCRIPT ساخته شده نه CSS . شما باید Ebook بخونید راجع به CSS .

موفق باشید.
 

پیوست ها

  • HOME PAGE.rar
    289 بایت · بازدیدها: 5
آخرین ویرایش:
adame_haji

adame_haji

Member
آقا راجع به هوم پیج هم ممنون
خیلی حال دادی

راجع به جاوا اسکریپت هم درست فرمودی اینم کدش که کپی پیست میکنم :
کد: 
function process(){}

  today = new Date()

  if(today.getMinutes() < 10) {
    pad = "0"}
  else
    pad = "";
  document.write("<SPAN class=sayansat>خوش آمديد</FONT>")

  if((today.getHours() < 12) && (today.getHours() >= 6))
  {  document.write("<center><SPAN class=sayansat>صبح بخير</FONT></center>")}

  if((today.getHours() >= 12) && (today.getHours() < 18))
  {  document.write("<center><SPAN class=sayansat>ظهر بخير</FONT></center>")}

  if((today.getHours() >= 18) && (today.getHours() <= 23))
  {  document.write("<center><SPAN class=sayansat>شب بخير</FONT></center>")}

  if((today.getHours() >= 0) && (today.getHours() < 4))
  {  document.write("<center><SPAN class=sayansat>اين موقع شب بيداريد؟!</FONT></center>")}

  if((today.getHours() >= 4) && (today.getHours() <= 6))
  {  document.write("<center><SPAN class=sayansat>با آرزوي شروع يك روز خوب</FONT></center>")}

  document.write("<center><SPAN class=sayansat>ساعت ",today.getHours(),":",pad,today.getMinutes())

راجع به این جور چیزا من دستم به هیچ جا بند نیست .
Ebook هم ندارم
اگه سایتی سراغ داری که Ebook یا نمونه کار داره یه ندا بده چون با هر دوتاش آدم میتونه پیشرفت کنه

یا علی
 
برای ارسال پاسخ شما باید وارد سیستم شوید.

آخرین مطالب مجیدآنلاین

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

بالا