Izlecošie paskaidrojumi.


Sākumlapa Iepriekšējā lappuse

Title

Lai izveidotu paskaidrojumu par kdu vrdu tekst, piemram par o vrdu, var izmantot parametru title. o parametru var lietot dads komands, piemram, span, a, img. Lai uzreiz btu ieraugms, kuram vrdam ir pieejams ds skaidrojums, tiek izmantota klase, kur ir noteikts, ka vrds jpasvtro ar punkttu lniju. Parametra vrtba kst redzama ilgk paturot peles kursora virs attiecg vrda vai attla. Labak title paba  to saprot un parda lielka daa msdienu prlku.

.ir_skaidrojums, .ka_kursors, .kvadraats{ border-bottom: 1px dotted navy; }
<h2>Title</h2> <p>Lai izveidotu paskaidrojumu par kdu vrdu tekst, piemram par o <span title="Lai redztu o ierakstu, virs vrda jpatur peles kursors" class=ir_skaidrojums>vrdu</span>, var izmantot parametru <tt>title</tt>. o parametru var lietot dads komands, piemram, <code>span</code>, <code>a</code>, <code>img</code>. Lai uzreiz btu ieraugms, kuram vrdam ir pieejams ds skaidrojums, tiek izmantota klase, kur ir noteikts, ka vrds jpasvtro ar punkttu lniju. Parametra vrtba kst redzama ilgk paturot peles kursora virs attiecg vrda vai attla. Labak <tt>title</tt> paba  to saprot un parda lielka daa msdienu prlku. </p>

Hover

Izmantojot hover notikumu un stilus, paskaidrojumu var izveidot daudz tkamku, k, piemram, im vrdam is ir dot vrda skaidrojums
Zemeslode
. K redzams, paskaidrojum var iekaut kaut vai attlus. Izveidotos stilus iespjams pielietot vairkkrtgi, piemram, ar im vrdam is ir dot vrda skaidrojums.
Uzklikini, lai atgrieztos lap par stiliem.
ir savs skaidrojums. Taj, savukrt, atrodama norde uz stilu aprakstu lapu.

Dotaj piemr izveidotas divas klases  ir_skaidrojums un skaidrojums. Vrdam, kuram ir skaidrojums, ar komandu span pieirta klase ir_skaidrojums. Savukrt paam skaidrojumam pieirta apakklase skaidrojums iekaujot otru komandu span.

Galvens pabas, kuras jpieir ajm klasm, ir:

Microsoft Internet Explorer 10 patnba  paskaidrojums pards tikai tad, kad uz dot vrda uzklikina, bet veckm versijm vispr nepards.

.ir_skaidrojums, .ka_kursors, .kvadraats{ border-bottom: 1px dotted navy; } .skaidrojums { visibility: hidden; position: absolute; display: block; left: 3em; right: 3em; margin-top: -3px; padding: 2em; border-radius: 9px; background: rgba(255,255,0,0.9); color: black; border: 2px solid rgba(0,0,128,0.4); z-index: 2; } .ir_skaidrojums:hover { color: red; cursor: help; text-decoration: none; } .ir_skaidrojums:hover .skaidrojums { visibility: visible; } /* Nepieciems IE lietotjiem */ .ir_skaidrojums:active .skaidrojums { visibility: visible; }
<h2>Hover</h2> <p>Izmantojot <code>hover</code> notikumu un stilus, paskaidrojumu var izveidot daudz tkamku, k, piemram, im <span class=ir_skaidrojums>vrdam <span class=skaidrojums>is ir dot vrda skaidrojums<br><img src=/atteli/mazini/Pasaule/e_01-31_m.ani.gif width=83 height=80 border=0 hspace=21 vspace=21 title="i ir Zemeslode" alt="Zemeslode"></span></span>. K redzams, paskaidrojum var iekaut kaut vai attlus. Izveidotos stilus iespjams pielietot vairkkrtgi, piemram, ar im <span class=ir_skaidrojums>vrdam <span class=skaidrojums>is ir dot vrda skaidrojums.<br><a href=stili.shtml>Uzklikini, lai atgrieztos lap par stiliem.</a></span></span> ir savs skaidrojums. Taj, savukrt, atrodama norde uz stilu aprakstu lapu. </p> <p> Dotaj piemr izveidotas divas klases  ir_skaidrojums un skaidrojums. Vrdam, kuram ir skaidrojums, ar komandu <code>span</code> pieirta klase ir_skaidrojums. Savukrt paam skaidrojumam pieirta apakklase skaidrojums iekaujot otru komandu <code>span</code>. </p> <p>Galvens pabas, kuras jpieir ajm klasm, ir: <ul> <li>Klasei skaidrojums: <ul> <li><code>visibility:</code> <tt>hidden;</tt> skotnji paslpj;</li> <li><code>position:</code> <tt>absolute;</tt> novieto virs prj lapas satura;</li> <li><code>display:</code> <tt>block;</tt>, <code>left:</code> <tt>3em;</tt>, <code>right:</code> <tt>3em;</tt> nodroina, ka paskaidrojums neizskries rpus prlka loga un bs aizsniedzami paskaidrojum ievietotie interaktvie elementi.</li> </ul> </li> <li>Skaidrojumu padara redzamu sekojoais klases apraksts: <pre> .ir_skaidrojums:hover .skaidrojums { visibility: visible; } </pre> </li> </ul> </p> <p><i>Microsoft Internet Explorer 10</i> patnba  paskaidrojums pards tikai tad, kad uz dot vrda uzklikina, bet veckm versijm vispr nepards.</p>

Cursor

Vl pastv iespju k vrda paskaidrojumu izmantot attlu nomainot peles kursoru, kad tas ir virs attiecg vrda. Kursoru izskatu nosaka parametrs cursor: , kuram k vrtbu var nordt kursora nosaukumus (default, crosshair, help u.t.t.) vai ar atbilstou attlu (url(..)). Neskatoties uz to, ka iespja aizstt peles kursoru ar brvi izvltu attlu jau bija aprakstta CSS 2, s iespjas atbalsts ir nepilngs. Internet Explore spj pardt tikai Windows kursoru failus (*.cur), nevis attlus, Opera ldz pat 12.16. versijai (ieskaitot) neizmanto url(), savkrt uz Chromium bztie prlki sevi ir ierobeojui ar attla izmru (32  32 piksei).

.ir_skaidrojums, .ka_kursors, .kvadraats{ border-bottom: 1px dotted navy; } .ka_kursors { cursor: url(att/OpenClipart.org_johnny_automatic_look_it_up.png), help; } .kvadraats { cursor: url(att/smaidulis.png), url(att/smaidulis.cur), help; }
<h2>Cursor</h2> <p>Vl pastv iespju k <span class=ka_kursors>vrda paskaidrojumu</span> izmantot attlu nomainot peles kursoru, kad tas ir virs attiecg <span class=ka_kursors>vrda</span>. Kursoru izskatu nosaka parametrs <code>cursor: </code>, kuram k vrtbu var nordt kursora nosaukumus (<tt>default, crosshair, help</tt> u.t.t.) vai ar atbilstou attlu (<tt>url(..)</tt>). Neskatoties uz to, ka iespja aizstt peles kursoru ar brvi izvltu attlu jau bija aprakstta <i>CSS 2</i>, s iespjas atbalsts ir nepilngs. <i>Internet Explore</i> spj pardt tikai <span class=kvadraats><i>Windows</i> kursoru failus (<i>*.cur</i>)</span>, nevis attlus, <i>Opera</i> ldz pat 12.16. versijai (ieskaitot) neizmanto <code>url()</code>, savkrt uz <i>Chromium</i> bztie prlki sevi ir ierobeojui ar <span class=kvadraats>attla izmru (32  32 piksei)</span>. </p>

Saturs Iepriekšējā lappuse Lappas saturs


priede.bf.lu.lv Bioloģijas fakultāte Datorklase Sākumlapa
Pamatlapa BF Datorklase Sākums
Lappusi
«skaidro.shtml»
veidoja
karlo@lanet.lv
2014.08.20-14:27
Lapa ir publicēta ar    CC    BY–SA    3.0 licenci. Ja lapā ir ietvertas daļas uz kurām attiecas cita licence, tas norādīts atsevišķi lapas tekstā.