linkedin facebook linkedin facebook nod32

Vertikal va gorizontal menyular

Muallif: Mengliyev SH.

Qo`shilgan sana: 2014-10-10

Vertikal va gorizontal menyular

Grafik menyular shunisi bilan qulayki, mualiff uning komponentalarini doimo yeatrlicha aniqlikda ekranga joylashtirishi mumkin.   Bu esa, o’z navbatida, sahifaning boshqa elementlarini ham menyu elementlariga nisbatan aniqroq joylashtirishga imkon beradi:

<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" ALIGN="center">

<TR ALIGN="center">

<TD><IMG NAME="e0" SRC="empty.gif" WIDTH="15" HEIGHT="8" BORDER="0"></TD>

<TD><IMG NAME="e1" SRC="empty.gif" WIDTH="15" HEIGHT="8" BORDER="0"></TD>

<TD><IMG NAME="e2" SRC="empty.gif" WIDTH="15" HEIGHT="8" BORDER="0"></TD>

<TD><IMG NAME="e3" SRC="empty.gif" WIDTH="15" HEIGHT="8" BORDER="0"></TD>

</TR>

<TR>

<TD><A HREF="javascript:void(0);" onMouseover="document.e0.src='arrowdw.gif';return true;" onMouseout="document.e0.src='empty.gif';return true;">

<IMG SRC="image1.gif" BORDER="0"></A></TD>

<TD><A HREF="javascript:void(0);" onMouseover="document.e1.src='arrowdw.gif';return true;" onMouseout="document.e1.src='empty.gif';return true;">

<IMG SRC="image2.gif" BORDER="0"></A></TD>

<TD><A HREF="javascript:void(0);" onMouseover="document.e2.src='arrowdw.gif';return true;" onMouseout="document.e2.src='empty.gif';return true;">

<IMG SRC="image3.gif" BORDER="0"></A></TD>

<TD><A HREF="javascript:void(0);" onMouseover="document.e3.src='arrowdw.gif';return true;" onMouseout="document.e3.src='empty.gif';return true;">

<IMG SRC="image4.gif" BORDER="0"></A></TD>

</TR>

</TABLE>

   

Bu holatda ko’rsatkich sichqoncha ko’rsatib turgan elementlar ustidan aniq yuguradi.  Keng ma’noda olganda IMG dagi ALT atributini qo’llash va status satrida undan nusxa olish yangi grafik elementni qo’shishga qaraganda ko’proq informativ hisoblanadi. Tug’ri, ALTdagi bor narsalar sal kechikibroq tasvirlanadi.
Endi hozir, shunday qilish qabul qilinganidek, matnning grafik bloklari asosida qurilgan vertikal menyuni amalga oshirilishini ko’rib chiqamiz:

<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" ALIGN="center">

<TR>

<TD><A HREF="javascript:void(0);" onMouseover="document.evente1.src='corner.gif';" onMouseout="document.evente1.src='clear.gif';">

<IMG SRC="image1.gif" border="0"></A></TD>

<TD><A HREF="javascript:void(0);" onMouseover="document.evente1.src='corner.gif';" onMouseout="document.evente1.src='clear.gif';">

<IMG NAME="evente1" SRC="clear.gif" border="0"></A></TD>

</TR>

<TR>

<TD><A HREF="javascript:void(0);" onMouseover="document.evente2.src='corner.gif';" onMouseout="document.evente2.src='clear.gif';">

<IMG SRC="image2.gif" border="0"></A></TD>

<TD><A HREF="javascript:void(0);" onMouseover="document.evente2.src='corner.gif';" onMouseout="document.evente2.src='clear.gif';">

<IMG NAME="evente2" SRC="clear.gif" border="0"></A></TD>

</TR>

<TR>

<TD><A HREF="javascript:void(0);" onMouseover="document.evente3.src='corner.gif';" onMouseout="document.evente3.src='clear.gif';">

<IMG SRC="image3.gif" border="0"></A></TD>

<TD><A HREF="javascript:void(0);" onMouseover="document.evente3.src='corner.gif';" onMouseout="document.evente3.src='clear.gif';">

<IMG NAME="evente3" SRC="clear.gif" border="0"></A></TD>

</TR>

<TR>

<TD><A HREF="javascript:void(0);" onMouseover="document.evente4.src='corner.gif';" onMouseout="document.evente4.src='clear.gif';">

<IMG SRC="image4.gif" border="0"></A></TD>

<TD>

<A HREF="javascript:void(0);" onMouseover="document.evente4.src='corner.gif';" onMouseout="document.evente4.src='clear.gif';">

<IMG NAME="evente4" SRC="clear.gif" border="0">

</A></TD>

</TR>

</TABLE>

   

Sichqoncha harakatlanganda uning ostiga tushgan mos komponentaning “burchagi egiladi”. Berilgan holda “burchak” – bu mustaqil rasm. Barcha burchaklar jadvalning o’ng ustunida amalga oshirilgan. Gipermatnli o’tish har ikkala rasm (matn va “burchak”) bo’yicha ham ishlashi uchun grafik obrazlarni qamrab oluvchi A ning bir xil konteinerlari qo’llaniladi. Bu yechimda bitta kamchilik bor: matndan “burchakka” o’tishda keyingisi “miltillaydi”. Rasmlarni jadvalning bitta yacheykasiga joylashtirish ham mumkin, lekin bu holda uning kengligini berish kerak bo’ladi, aks holda brauzer oynasining o’lchamlari o’zgartirilganda, rasmlar “siljib ” ketishi mumkin. “Miltillashni” yo’qotish uchun to’la qonli rasm almashtirishlar qilish kerak.
“Miltillash” konteiner разметкasining bir elementidan ikkinchisiga o’tganida ro’y beradi. Bunda element  tasvirlanishining hossalari qaytadan aniqlanadi.

Ichma ich qo’yilgan menyular

Formalarni dasturlashni muhokama qilinganda ta’kidlangan ediki, HTML da ichma ich qo’ilgan menyularni yaratishning standart usuli yo’q.  Shunga qaramasdan grafikaning hisobiga uning o’xshashini yaratish mumkin. Bunda shuni esda tutish lozimki, grafika yotgan joyni metn bilan to’ldirish mumkin emas:

<SCRIPT>

function submenu(a)

{

if(a==1)

{

document.menu00.src="image1.gif"; // 1 (активна)

document.menu10.src="image2.gif"; // 2

document.menu01.src="image3.gif"; // 1 пункт вложенного меню 1

document.menu02.src="image4.gif"; // 2 пункт вложенного меню 1

}

if(a==2)

{

document.menu00.src="image1.gif"; // 2

document.menu10.src="image2.gif"; // 1 (активна)

document.menu01.src="image3.gif"; // 1 пункт вложенного меню 2

document.menu02.src="image4.gif"; // 2 пункт вложенного меню 2

}

}

</SCRIPT>

 

<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" ALIGN="center">

<TR>

<TD><A HREF="javascript:void(0);" onMouseover="submenu(1);return true;">

<IMG NAME=menu00 SRC=image1.gif BORDER=0></a></td>

<TD><IMG NAME=menu01 SRC=image3.gif BORDER=0></TD>

</TR>

<TR>

<TD><A HREF="javascript:void(0);" onMouseover="submenu(2);return true;">

<IMG NAME=menu10 SRC=image2.gif BORDER=0></td>

<TD><IMG NAME=menu02 SRC=image4.gif BORDER=0></TD>

</TR>

</TABLE>

   

Bu misolda ichma ich qo’yilgan menyu asosiydan o’ng tomonda joylashgan. Ichma ich qo’ilganlikka rangning o’zgarishi hisobiga erishiladi. Menyuning bo’ysunishini uning vaziyatini asosiy menyuga nisbatan o’zgarishida ko’rsatish mumkin.
Bu holatda menyuni pastga harakatga keltirish uchun korinuvchi yoki ko’rinmas rasmlar vositasida joyni band qilish kerak. Bular hech qanday yuklanishni olmaydigan illyustrativ rasmlar bo’lishi shart emas.Qatlamlardan foydalangan holda haqiqiy ichma ich qo’yilgan menyularni yaratish mumkin.

2210 marta o`qildi.

Parol:
Eslab qolish.


Ro`yhatdan o`tish

testing

+998915878681

Siz o`z maxsulotingizni 3D reklama ko`rinishda bo`lishini xohlaysizmi? Unda xamkorlik qilamiz.

3D Reklama


Рейтинг@Mail.ru
Рейтинг@Mail.ru

Besucherzahler
счетчик посещений