ንጥረ ነገሩ ግልጽ ነው። CSS ግልጽነት ያለው ንብረት፡ ግልጽነትን ይቆጣጠራል። የተለያዩ ንጥረ ነገሮች ግልጽነት

በሲኤስኤስ ውስጥ ግልፅነት በቅርብ ጊዜ በጣም ወቅታዊ ዘዴ ነው ፣ ይህም በአሳሽ አተገባበር ላይ ችግሮች ያስከትላል። ለሁሉም አሳሾች ግልጽነትን መተግበርን የሚፈቅድ ምንም አይነት ሁለንተናዊ ዘዴ አሁንም የለም። ይሁን እንጂ ከቅርብ ጊዜ ወዲህ ሁኔታው ​​​​በጣም ተሻሽሏል.

ይህ ጽሑፍ በትንሹ ጥረት በሁሉም አሳሾች ውስጥ ተመሳሳይ ውጤት ለማግኘት የሚረዱዎትን የነባር አቀራረቦችን እንዲሁም የኮድ ምሳሌዎችን እና ማብራሪያዎችን በጥልቀት ያቀርባል።

አንድ ሊጠቀስ የሚገባው ነገር ግልጽነት ለበርካታ አመታት ሲኖር፣ የCSS መስፈርት አካል ሆኖ አያውቅም። ይህ የCSS3 ዝርዝር አካል መሆን ያለበት መደበኛ ያልሆነ ንብረት ነው።

የድሮ አቀራረብ

በቀድሞ የፋየርፎክስ እና ሳፋሪ ስሪቶች ንብረቱን በሚከተለው መልኩ መተግበር አለብዎት።

#MyElement (-khtml - ግልጽነት፡ .5፤ -ሞዝ-የማይታወቅ፡ 0.5፤)

የ-khtml ግልጽነት ባህሪው በድሮ የዌብኪት አሳሾች ስሪቶች ውስጥ ጥቅም ላይ ውሏል። ይህ ንብረት ተቋርጧል እና ከጣቢያዎ ትራፊክ ውስጥ ጉልህ የሆነ ክፍል Safari 1.x ከሚጠቀሙ ጎብኝዎች እንደሚመጣ እርግጠኛ እስካልሆኑ ድረስ አያስፈልግም፣ ይህ ደግሞ የማይመስል ነው።

የሚቀጥለው መስመር በሞዚላ ሞተር በጣም ቀደምት ስሪቶች ላይ የሚሰራውን -moz-opacity ንብረትን ይጠቀማል። ፋየርፎክስ በስሪት 0.9 መደገፉን አቁሟል።

የCSS ግልጽነት በፋየርፎክስ፣ ሳፋሪ፣ ክሮም እና ኦፔራ

ለአብዛኛዎቹ ዘመናዊ አሳሾች የሚከተሉትን ንብረቶች መጠቀም በቂ ነው-

#MyElement ( ግልጽነት፡ .7፤ )

ከላይ ባለው ምሳሌ ኤለመንት ወደ 70% ግልጽነት (30% ግልጽነት) ተቀናብሯል. ማለትም እሴቱን ወደ አንድ ካዘጋጀነው ኤለመንቱ ግልጽ ያልሆነ ይሆናል፣ እና በዚህ መሰረት፣ ይህንን እሴት ወደ ዜሮ ማቀናበሩ የማይታይ ያደርገዋል።

ግልጽነት የሌለው ንብረት 2 አስርዮሽ አሃዞችን ያስኬዳል። ያም ማለት ".01" ዋጋ ከ ".02" ዋጋ ይለያል, ምንም እንኳን ይህ የማይታወቅ ቢሆንም.

የ CSS ግልጽነት ለኢንተርኔት ኤክስፕሎረር

እንደተለመደው ኢንተርኔት ኤክስፕሎረር ከሌሎች አሳሾች ጋር ወዳጃዊ አይደለም። በተጨማሪም ፣ በአሁኑ ጊዜ የዚህ አሳሽ ሶስት ስሪቶች በትክክል በሰፊው ጥቅም ላይ አሉን ፣ በእያንዳንዳቸው ውስጥ ያለው ግልጽነት መቼት የተለየ እና አንዳንድ ጊዜ አወንታዊ ውጤት ለማግኘት ተጨማሪ ጥረት ይጠይቃል።

#MyElement ( ማጣሪያ፡ alpha(opacity=40);)

ይህ ምሳሌ በ6-8 ስሪት ውስጥ የሚሰራውን የማጣሪያ ንብረቱን ይጠቀማል፣ ነገር ግን ለ6 እና 7 ስሪት አንድ ገደብ አለ፡ የኤለመንቱ hasLayout ንብረቱ ወደ እውነት መዋቀር አለበት። ይህ ንብረት በ IE ውስጥ ብቻ ነው ያለው እና ስለሱ የበለጠ ማንበብ ይችላሉ, ለምሳሌ, በ Habré.

በ IE8 ውስጥ CSS ን በመጠቀም ግልጽነትን ለማዘጋጀት ሌላኛው መንገድ የሚከተለውን አካሄድ መጠቀም ነው (አስተያየቶቹን ያስተውሉ)

#myElement (ማጣሪያ፡ progid:DXImageTransform.Microsoft.Alpha(opacity=40);/* በ IE6፣ IE7 እና IE8 ውስጥ ይሰራል */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=40)"; / * ለ IE8 ብቻ */)

የመጀመሪያው መስመር በሁሉም በአሁኑ ጊዜ ጥቅም ላይ የዋሉ ስሪቶች ውስጥ ይሰራል, ሁለተኛው - በ IE8 ውስጥ ብቻ. ሁለተኛው መስመር -ms- ቅድመ ቅጥያውን እንደሚጠቀም እና እሴቱ በጥቅሶች ውስጥ መሆኑን ልብ ይበሉ።

ጃቫ ስክሪፕት ወይም jQuery በመጠቀም የሲኤስኤስ ግልጽነት ማቀናበር እና መለወጥ

ግልጽነትን ለማዘጋጀት የሚከተለውን ኮድ መጠቀም ይችላሉ፡-

Document.getElementById("myElement").style.opacity = ".4"; // ለአብዛኛዎቹ አሳሾች document.getElementById("myElement").style.filter = "alpha(opacity=40)"; // ለ IE

በእርግጥ በዚህ አጋጣሚ jQuery ን መጠቀም በጣም ቀላል ነው, በተጨማሪም, በሁሉም አሳሾች ውስጥ ይሰራል.

$ ("#myElement").css (( ግልጽነት: .4 )); // በሁሉም አሳሾች ውስጥ ይሰራል

ይህንን ንብረት ማንቃት ይችላሉ፡-

$("#myElement").አኒሜት (( ግልጽነት: .4), 1000, ተግባር () (// አኒሜሽን ሙሉ ነው, ይህ ኮድ በሁሉም አሳሾች ውስጥ ይሰራል. ));

RGBA ተግባር

CSS3 የrgba ተግባርን በመጠቀም የአልፋ ቻናሎችን ለመደገፍ አቅዷል። ይህ ባህሪ በፋየርፎክስ 3+፣ ኦፔራ 10.1+፣ Chrome 2+፣ ሳፋሪ 3.1+ ውስጥ ይሰራል። እንደሚከተለው ጥቅም ላይ ይውላል.

#rgba ( ዳራ፡ rgba (98, 135, 167, .4);)

በዚህ ሁኔታ, የመጨረሻው መለኪያ ግልጽነት ደረጃን ያሳያል.

HSLA ተግባር

ከቀዳሚው ተግባር ጋር በሚመሳሰል መልኩ፣ CSS3 የ HSLA ተግባርን በመጠቀም ከፊል-ግልጽ የሆነ ቀለም እንዲያዘጋጁ ይፈቅድልዎታል ፣ የእነሱ መለኪያዎች Hue ፣ Saturation ፣ Lightness እና Alpha ናቸው።

#hsla (ዳራ፡ hsla(207፣ 38%፣ 47%፣ .4);)

የ rgba እና hsla ተግባራትን በሚጠቀሙበት ጊዜ አንድ አስፈላጊ ነጥብ ግልጽነት መቼቱ በልጆች አካላት ላይ የማይተገበር ሲሆን ግልጽነት የጎደለው ንብረቱ ግን በዘር የሚተላለፍ ነው።

የCSS ግልጽነት ባህሪ በኤችቲኤምኤል ውስጥ ላሉ ንጥረ ነገሮች (ሥዕሎች፣ ጽሑፎች፣ ብሎኮች) ግልጽነት ተጠያቂ ነው።

የሲኤስኤስ ግልጽነት አገባብ

ግልጽነት፡ ዋጋ;

እሴቱ ከ 0.0 እስከ 1.0 ባለው ክልል ውስጥ እውነተኛ እሴቶችን የሚወስድበት። የ 1.0 እሴት ማለት ግልጽነት የሌለው (ነባሪ) ማለት ነው.

ምሳሌዎች፡ ልክ በኤችቲኤምኤል ውስጥ ግልጽነት

ምሳሌ ቁጥር 1 በኤችቲኤምኤል ውስጥ ግልፅ ምስል

የመጀመሪያው ምስል ያለ ግልጽነት ይታያል, ሁለተኛው ደግሞ ግልጽነት 0.5

Пример №2. Эффекты с прозрачностью в html

По умолчанию блок частично прозрачный. При наведении курсора мыши блок становится ярким. Такие эффекты зачастую используются в дизайне сайтов.

На странице преобразуется в следующее

Пример №3. Прозрачный блок на изображении в html

Ниже приведен пример полупрозрачного блока, который частично закрыл изображение. Блок специально накрывает изображение не полностью с целью показать, как он выглядит на пустом фоне.

На странице преобразуется в следующее

CSS прозрачность - кросс-браузерное решение - 3.8 out of 5 based on 6 votes

В данном уроке мы рассмотрим CSS прозрачность, узнаем как придать различным элементам страницы прозрачность и добиться полной кросс-браузерности, т. е. одинаковой работы этого эффекта в различных браузерах.

Как задать прозрачность любого элемента

В CSS3 за создание прозрачных элементов отвечает свойство opacity, которое можно применять к любым элементам. У данного свойства имеются значения от 0 до 1, которые и определяют степень прозрачности. Где 0 - это полная прозрачность, (значение по умолчанию для всех элементов), а 1 полная непрозрачность. Записываются значения дробями: 0.1, 0.2, 0.3 и т. д.

Пример использования:

Прозрачность



የአሳሽ ተሻጋሪ ግልጽነት

ሁሉም አሳሾች ከላይ ያለውን ግልጽነት ባህሪ በተመሳሳይ መንገድ አይገነዘቡትም እና አይተገብሩም። በአንዳንድ ሁኔታዎች የተለየ የንብረት ስም ወይም ማጣሪያዎችን መጠቀም አስፈላጊ ነው.

የ CSS3 ግልጽነት ባህሪው በሚከተሉት የአሳሽ አይነቶች ይደገፋል፡- ሞዚላ 1.7+፣ ፋየርፎክስ 0.9+፣ ሳፋሪ 1.2+፣ ኦፔራ 9+።

በጣም ጥሩ :) እንደ ኢንተርኔት ኤክስፕሎረር ያለ አሳሽ እስከ ስሪት 9.0 ድረስ ግልጽነት ያለው ባህሪን አይደግፍም እና ለዚህ አሳሽ ግልጽነት ለመፍጠር የማጣሪያ ንብረቱን እና አልፋ (Opacity=X) እሴትን መጠቀም ያስፈልግዎታል, በውስጡም X ኢንቲጀር ነው. ከ 0 እስከ 100 ያለው ክልል, ይህም ግልጽነት ደረጃን ይወስናል. 0 ሙሉ በሙሉ ግልጽ ነው እና 100 ሙሉ በሙሉ ግልጽ ያልሆነ ነው.

ከስሪት 3.5 በፊት እንደነበረው ፋየርፎክስ፣ ከብርሃንነት ይልቅ የ-moz-opacity ንብረቱን ይደግፋል።

በKHTML ሞተር ላይ የተገነቡ እንደ Safari 1.1 እና Konqueror 3.1 ያሉ አሳሾች ግልጽነትን ለመቆጣጠር የ-khtml-opacity ንብረቱን ይጠቀማሉ።

በሁሉም አሳሾች ውስጥ ተመሳሳይ እንዲመስል በሲኤስኤስ ውስጥ ግልፅነትን እንዴት ማቀናበር ይችላሉ? ለኤለመንት ግልጽነት የአሳሽ አቋራጭ መፍትሄ ለመፍጠር አንድ ግልጽነት ያለው ንብረት ብቻ ሳይሆን የሚከተሉትን የንብረቶቹ ስብስብ መግለጽ አለባቸው።

ማጣሪያ: አልፋ ( ግልጽነት = 50); /* ግልጽነት ለ IE */ -moz-opacity: 0.5; /* ሞዚላ 3.5 እና ከዚያ በታች ይደግፋል */ -khtml - ግልጽነት: 0.5; /* Konqueror 3.1 እና Safari 1.1 ን ይደግፋል */ ግልጽነት: 0.5; /* ሁሉንም ሌሎች አሳሾች ይደግፋል */

የተለያዩ ንጥረ ነገሮች ግልጽነት

በገጹ ላይ በብዛት ጥቅም ላይ ለሚውሉ አንዳንድ አካላት ግልጽነትን የማዘጋጀት አንዳንድ ምሳሌዎችን እንመልከት።

የሲኤስኤስ ምስል ግልጽነት.

ግልጽ የሆነ ምስል ለመፍጠር ብዙ አማራጮችን እንመልከት. በሚከተለው ምሳሌ, የመጀመሪያው ምስል ግልጽነት የለውም, ሁለተኛው 50%, እና ሦስተኛው 30% ነው.

ግልጽነት



ውጤት፡

በምስል ላይ ሲያንዣብቡ በሲኤስኤስ ውስጥ ግልጽነት።

ብዙውን ጊዜ ጠቋሚው በላዩ ላይ በሚያንዣብብበት ጊዜ ስዕል ወይም ሌላ ማንኛውንም አካል ግልጽ ማድረግ አስፈላጊ ነው። ይህንን በ CSS pseudo-class:hover በመጠቀም ማድረግ ይችላሉ። ይህንን ለማድረግ የእኛ ሥዕል ሁለት ክፍሎችን መመደብ አለበት ፣ አንድ መደበኛ - ይህ የሥዕሉ እንቅስቃሴ-አልባ ሁኔታ እና ሁለተኛው ክፍል ከሐሰት-ክፍል ጋር ይሆናል-ማንዣበብ ፣ እዚህ የስዕሉን ግልፅነት በወቅቱ መግለጽ ያስፈልግዎታል ። ጠቋሚውን የማንዣበብ.

ግልጽነት



ውጤቱን በማሳያው ውስጥ ማየት ይችላሉ.

ሲኤስኤስን በመጠቀም የበስተጀርባ ግልፅነት።

እዚህ ላይ ግልጽነት በሁሉም የጎጆ አካላት ላይ እንደሚተገበር እና ከተቀማጭ አካል የበለጠ ግልጽነት ሊኖራቸው እንደማይችል ማስታወስ ያስፈልጋል.

ለአብነት ያህል፣ ሥዕልን በመጠቀም የተፈጠረ የገጽ ዳራ ያለው ልዩነት እና ቀለም በመጠቀም የተፈጠረ እና 50% ግልፅነት ያለው ብሎክ እንሰጣለን።

የናሙና ኮድ፡

ግልጽነት

ጽሑፍ


ከላይ የተለጠፈው ኮድ ውጤት ይኸውና፡-

orem Ipsum በቀላሉ የህትመት እና የጽሕፈት መኪና ኢንዱስትሪ ጽሑፍ ነው። ሎሬም ኢፕሱም ከ1500ዎቹ ጀምሮ የኢንደስትሪው ደረጃውን የጠበቀ የዱሚ ጽሑፍ ነው፡ ፡ አንድ ያልታወቀ ማተሚያ ጋሊ አይነት ወስዶ የናሙና መጽሃፍ ለመስራት ሲታገል ቆይቷል። ከአምስት መቶ ዓመታት ብቻ ሳይሆን ወደ ኤሌክትሮኒክስ መክተቻ መዝለልም ችሏል። በ1960ዎቹ የሎሬም ኢፕሱም ምንባቦችን የያዙ Letraset ሉሆች ሲለቀቁ እና በቅርብ ጊዜ እንደ Aldus PageMaker ያሉ የሎሬም ኢፕሰም ስሪቶችን ጨምሮ በዴስክቶፕ ማተሚያ ሶፍትዌሮች ተስፋፋ።
አንድ አንባቢ የአንድን ገጽ አቀማመጥ ሲመለከት ሊነበብ በሚችል ይዘት እንደሚዘናጋ የተረጋገጠ እውነታ ነው። ሎሬም ኢፕሰምን የመጠቀም ነጥቡ ብዙ ወይም ያነሰ መደበኛ የፊደላት ስርጭት ያለው መሆኑ ነው፣ በተቃራኒው "ይዘት እዚህ፣ ይዘት እዚህ"፣ የሚነበብ እንግሊዘኛ እንዲመስል ያደርገዋል። ብዙ የዴስክቶፕ ማተሚያ ፓኬጆች እና የድረ-ገጽ አርታኢዎች አሁን Lorem Ipsumን እንደ ነባሪ የሞዴል ጽሁፋቸው ይጠቀማሉ፣ እና "lorem ipsum" ፍለጋ ገና በጨቅላነታቸው ብዙ ድረ-ገጾችን ይከፍታል። ለዓመታት የተለያዩ ስሪቶች ተሻሽለዋል፣ አንዳንዴ በአጋጣሚ፣ አንዳንዴም ሆን ተብሎ (በመርፌ የተወጋ ቀልድ እና የመሳሰሉት)።

ስለዚህ ዛሬ እንነጋገራለን በኤችቲኤምኤል ውስጥ ግልፅነትገጾች. ምናልባት በአንዳንድ ታዋቂ ድረ-ገጽ ላይ የፎቶ ማዕከለ-ስዕላት ወይም የመግቢያ ቅጾች ግልጽ የሆኑ ብቅ-ባይ ብሎኮች አጋጥመውዎት ይሆናል። በኤችቲኤምኤል ውስጥ ለግልጽነት ብዙ አጠቃቀሞች አሉ። ስለዚህ እንዴት ነው የተሰራው እና የት ጥቅም ላይ ሊውል ይችላል?

ደህና ፣ በመጀመሪያ ፣ የእኛ ሰነድ አንድ ማሳያ አውሮፕላን ብቻ እንደሌለው እንረዳ - በአጠቃላይ 3-ልኬት ነው ፣ ይህንን በ “Z-index” በሚለው መጣጥፍ ውስጥ ጠቅሻለሁ። በዚህ መሠረት, ሙሉ በሙሉ ግልጽ የሆነ ንብርብር እንኳን, በማሳያው ቁልል አናት ላይ ቢሆን, ወደ ሌሎች ንጥረ ነገሮች መዳረሻን ያግዳል. ይህ ግልጽ ከሆኑት ብሎኮች አንዱ ዋና አጠቃቀም ነው። ምንም እንኳን የሻዲንግ ተፅእኖ በአብዛኛው ጥቅም ላይ የሚውል ቢሆንም, ሙሉ በሙሉ ግልጽ የሆነ ንብርብር በትክክል ይሠራል. ስለዚህ, ለምሳሌ, ብዙ ታዋቂ የፎቶ ጋለሪዎች ይሠራሉ; የተቀረው ገጽ በገጹ ላይ ያሉትን ሁሉንም ሌሎች ንጥረ ነገሮች መዳረሻን በመከልከል በ(ከፊል) ግልጽ ሽፋን ተሸፍኗል። እነዚያ። በእሱ ላይ ማንኛውንም አገናኝ ጠቅ በማድረግ ገጹን ለቀው መውጣት አይችሉም - ሁሉም ፅሁፎች በጀርባ ተሸፍነዋል። ወደ ጣቢያው አካል ለመመለስ አብዛኛውን ጊዜ ጋለሪውን ለመዝጋት, የመግቢያ ቅጽ, ወዘተ መቆጣጠሪያዎችን ይሰጣሉ. ጃቫስክሪፕት በመጠቀም ግልጽ የሆኑ ብሎኮችን ማሳየት/መደበቅ ይቆጣጠሩ። በሚያሳዝን ሁኔታ, ከእሱ ሌላ አማራጭ የለም. ሳይጠቀምበት፣ ተጠቃሚው ግልጽ የሆነውን ብሎክ ጨርሶ አያየውም፣ ወይም የአሁኑን ገጽ ሳይለቅ ሊዘጋው አይችልም። የታይነት ወይም የማሳያ ባህሪያት ለዚህ ጥቅም ላይ እንደሚውሉ አስተውያለሁ.

ስለዚህ ግልጽነት በእውነቱ በኤችቲኤምኤል እንዴት ይደራጃል? የአባልነት ግልጽነት በአጠቃላይ በሲኤስኤስ ዝርዝር ውስጥ አልተካተተም፣ ስለዚህ እሱን ለመፍጠር ብዙ መመሪያዎችን በአንድ ጊዜ መጠቀም አለብዎት። አንዳንድ አሳሾች (ማለትም) ከአንድ አማራጭ ጋር አብረው ይሰራሉ፣ ሌሎች ደግሞ በሌላ። Ie አብሮ የተሰራውን የማጣሪያ ተግባር ይጠቀማል፣ሌሎች አሳሾች ከ 0 (ሙሉ በሙሉ ግልፅ ነገር) እስከ 1 (ሙሉ በሙሉ ግልጽ ያልሆነ) ባለው ክልል ውስጥ የተቀመጠውን “ግልጽነት” ባህሪን ይጠቀማሉ። ለምሳሌ በ 30% ግልጽነት, መጻፍ አለብዎት " ግልጽነት: 0.30; ማጣሪያ: አልፋ (ብርሃን-አልባነት = 30);"ንብረቶቹ, ከምሳሌው እንደሚታየው, ተመሳሳይ ናቸው - በመጀመሪያው ሁኔታ ብቻ ከ 0 እስከ 1 ቁጥር ጥቅም ላይ ይውላል, በሁለተኛው ውስጥ የመቶኛ ምልክት ጥቅም ላይ ይውላል. የእንደዚህ አይነት እገዳ ምሳሌ:

<div style = "አቀማመጥ፡ ፍፁም፤ ላይ፡ 0፤ ግራ፡ 0፤ የጀርባ ቀለም፡ rgb(18፣ 114፣ 214)፤ ስፋት፡100%፤መታወቂያ = "የቪዲዮ ፍሬም" >

ምሳሌው ቪዲዮውን ድንክዬ ሲጫኑ የሚነቃውን የቪዲዮ ማሳያ ብሎክ ይጠቀማል። እንደ ማያ ገጹ መጠን እና የገጹ ሙላት ሊለያይ ስለሚችል የማገጃው ቁመት አልተገለጸም። ስለዚህ, ቪዲዮ ሲከፍት በተለዋዋጭነት ይሰላል. ይህንን ዘዴ የመጠቀም ምሳሌ በአንድ ጊዜ በሠራሁበት ruscircus.ru ድረ-ገጽ ዋና ገጽ ላይ ሊታይ ይችላል።

ያ ፣ በእውነቱ ፣ በኤችቲኤምኤል ውስጥ ያለው አጠቃላይ ግልፅነት ምስጢር ነው። ግልጽ የሆነ ውጤት ለማግኘት z-index እና opacity እንጠቀማለን። እና ለዚህ ብዙ መተግበሪያዎችን ማግኘት ይችላሉ - ሁሉም ነገር በአዕምሮዎ ብቻ የተገደበ ነው.

08.02.2013 በአስተያየቶቹ ውስጥ ለተጠየቁት ጥያቄዎች መልስ እሰጣለሁ, ማለትም ግልጽ በሆነ እገዳ ላይ እንዴት ግልጽ ያልሆነን ማድረግ እንደሚቻል. እዚህ ሁሉም ነገር ቀላል ነው ፣ ስለ z-index በቁሳዊ ነገሮች ላይ ያለውን አገናኝ ያመለከትኩት በከንቱ አይደለም ፣ ሌላ ብሎክ መፍጠር ያስፈልግዎታል ፣ ከግልጽነቱ ከፍ ያለ z-index። አሁን፣ በጥቂት ደቂቃዎች ውስጥ፣ አንድ ምሳሌ ቀረጽኩ። እገዳዎች

<div style = "አቀማመጥ፡ ፍፁም፤ ላይ፡ 0፤ ግራ፡ 0፤ የጀርባ ቀለም፡ rgb(18፣ 114፣ 214)፤ ስፋት፡100%፤ ቁመት፡100%፤ ግልጽነት: 0.30; ማጣሪያ: አልፋ (ብርሃን-አልባነት = 30); ታይነት፡የተደበቀ; z-index:1;መታወቂያ = "የቪዲዮ ፍሬም" > <div id = "VideoFrame2" style = "አቀማመጥ: ፍፁም; ከላይ: 25%; ግራ: 25%; የጀርባ ቀለም: ነጭ; ስፋት: 50%; ቁመት: 50%; ግልጽነት፡0.99; ማጣሪያ: አልፋ (ብርሃን-አልባነት = 99); ታይነት፡የተደበቀ; z-index:2; onclick = "javascript:HideForm();" >እዚህ ጽሑፉን እንጽፋለን</div>

እና ጃቫስክሪፕት ተግባራት

< script type= "text/javascript" >ተግባር ShowForm () ( document.getElementById ("VideoFrame") .style .visibility = "የሚታይ"፤ document.getElementById ("VideoFrame2") VideoFrame" ) .style .visibility = "የተደበቀ"፤ document.getElementById ("VideoFrame2") .style .visibility = "የተደበቀ"፤)

የመጀመሪያው ተግባር ግልጽ ብሎክን ያሳያል (ከተጣራ የጽሑፍ እገዳ ጋር) - ከአንድ አዝራር ጋር ሊታሰር ይችላል. አገናኝ, ወዘተ .. እኔ አለኝ ሁለተኛው ተግባር በጽሑፍ ብሎክ ላይ የመዳፊት ጠቅታ ጋር የተሳሰረ ነው - ይህ ግልጽ ብሎክ ይደብቃል.

ይህ እንዴት እንደሚሰራ ላይ የተወሰነ ግልጽነት እንደሰጠሁ ተስፋ አደርጋለሁ። ደህና, ካልሆነ, ጥያቄዎችን ይጠይቁ.