Kirjautuminen

Haku

Tehtävät

Keskustelu: Nettisivujen teko: Kuvan "otsikko"

Rocceri [06.03.2009 14:58:35]

#

Terve

Normaalisti kun määrittää sivulle kuvan <img src="kuva" title="jtn">
tämä jtn teksti näkyy sellaisessa laatikossa kun hiiren vie kuvan päälle.

Voisiko tätä "laatikko" editoida, vaikka CSS koodilla tai jotakin? :)

Merri [06.03.2009 15:11:11]

#

Sen tyyliä ei voi muokata, mutta voit JavaScriptillä poistaa sen ja lisätä toisenlaisen toiminnallisuuden.

En testannut tätä koodia, mutta näin pitäisi voida tehdä:

window.onload = function() {
    var img = document.getElementsByTagName('id');
    if( img ) {
        for( var i = 0, maxi = img.length; i < maxi; i++ ) {
            var title = img[i].getAttribute('title');
            if( title && title.length > 0 ) {
                img[i].removeAttribute('title');
                img[i].oma = title;
                img[i].onclick = function() {
                    alert(this.oma);
                }
            }
        }
    }
}

Tätä voi vaikka laajentaa niin, että lisäät vaikka jonkin classin jokaiselle muokatulle kuvalle. Sen jälkeen CSS:llä käyttää vaikka :before-pseudoa näyttämään contentin avulla tietoa. Tosin et voi ainakaan odottaa että IE:llä toimisi, ja muillakin selaimilla voi vielä mennä siihen kategoriaan, ettei moista ole toteutettu. Kokeilla kuitenkin voi.

Käyttämällä jotakin JavaScript-kirjastoa kuten vaikka jQuery saat lisää toimintoja, lyhempää syntaksia ja jopa parempaa toiminnallisuutta.

Rocceri [06.03.2009 15:40:28]

#

Tooltip tämä taitaa nimeltään olla.

Merri, en ihan tätä tarkoittanut :/
http://habbotaivas.co.cc/mainpage.php
Jotain tuon tapaista, kun kuvan päälle menee.

Short Php [06.03.2009 15:43:18]

#

Tuo on jo oma jQuery scripti

Juhko [06.03.2009 16:00:55]

#

Auttaisiko tämä yhtään: https://www.ohjelmointiputka.net/koodivinkit/25183-javascript-ponnahdusikkuna-jquerylla

Smuliii [06.03.2009 16:10:45]

#

Tsekkaas tämä tuto: http://net.tutsplus.com/videos/screencasts/you-still-cant-create-a-jquery-plugin/

Sieltä saat toimivan sorsan ja erittäin hyvät ohjeet videomuodossa.

Rocceri [06.03.2009 19:25:40]

#

Smuliii kirjoitti:

Tsekkaas tämä tuto: http://net.tutsplus.com/videos/screencasts/you-still-cant-create-a-jquery-plugin/

Sieltä saat toimivan sorsan ja erittäin hyvät ohjeet videomuodossa.

Tää on just sitä mitä halusin, kiitos!! :)

Vastaus

Aihe on jo aika vanha, joten et voi enää vastata siihen.

Tietoa sivustosta