Ang mga pop-up window para sa iba't ibang mga layunin ay maraming gamit sa pagbuo ng web. Maaari silang magamit upang lumikha ng iba't ibang mga uri ng mga menu, maglagay ng mga teksto at graphics ng advertising, mga tooltip kapag pinupunan ang mga kumplikadong form, at maginhawa na ilagay ang mga form sa kanilang sarili sa mga bintana na hindi kumukuha ng puwang sa pahina. Sa aming artikulo ay mahahanap mo ang isang paglalarawan kung paano ka makakagawa ng tulad ng isang window.
Kailangan iyon
Pangunahing kaalaman sa HTML
Panuto
Hakbang 1
popup, html, nakatagong layer
Hakbang 2
Sa maraming mga pahina sa web, maaari mong makita na ang mga magarbong aklatan ng iba't ibang mga balangkas ng JavaScript (jQuery, MooTools, Prototype, atbp.) Ay ginagamit upang lumikha ng mga pop-up window sa mga pahina. Gayunpaman, sa katunayan, hindi sila kinakailangan kapag nalulutas ang partikular na problemang ito. Ang mga tool na magagamit sa Hypertext Markup Language (HTML) at Cascading Style Sheets (CSS) ay sapat upang lumikha ng mga pop-up. Ang windows na nilikha sa ganitong paraan ay gagana hindi alintana kung ang JavaScript ay pinagana sa browser ng bisita.
Ang lahat ng mga code na lumilikha ng popup ay maaaring mailagay sa dalawang linya. Lumilikha ang unang linya ng isang link na dapat na-click upang maipakita ang popup:
Pindutin dito!
Dito, ang katangian ng onmouseover ng link tag ay nagtatakda ng default na uri ng cursor ng mouse para sa mga link. Tinutukoy ng katangiang onclick na kapag na-click ang link, dapat makita ang nakatagong block ng PopUp.
Ang pangalawang linya ay, sa katunayan, ang pop-up window. Layer kasama ang tagatukoy ng PopUp at ang laki ng window, kulay at laki ng teksto, background at hangganan na tinukoy sa istilo ng katangian:
Ito ang teksto sa popup
Hindi ito nakikita bilang default - ipinahiwatig ito ng tagapili ng display na may halaga na wala sa paglalarawan ng istilo ng layer.
Sa totoo lang, ito lang ang kailangan mo upang lumikha ng isang pop-up window - ilagay ang dalawang linya sa pagitan ng mga tag at iyong pahina at handa na itong umalis.
Hakbang 3
Upang ma-sarado ang pop-up window sa harap ng tag, kailangan mong magdagdag ng isang link na nagsasagawa ng kabaligtaran na pagkilos - itinatago ang nakikitang layer sa tagatukoy ng PopUp:
malapit na
Hakbang 4
At kung nais mong mag-pop up ang window hindi sa pamamagitan ng pag-click, ngunit sa pamamagitan ng pag-hover ng mouse cursor, kung gayon ang unang linya na may link ay dapat mabago sa ganitong paraan:
ilipat ang mouse dito!
Hakbang 5
Pamilyar ka ngayon sa prinsipyo at istraktura ng pop-up window code, at ang disenyo ng hitsura at nilalaman nito ay ganap na nakasalalay sa iyong mga layunin at imahinasyon.
