WebSite X5Help Center

 
Vittorio N.
Vittorio N.
User

Usare @media per sostituire un'immagine  it

Autor: Vittorio N.
Visitado 1211, Seguidores 2, Compartilhado 0  

ciao e buon anno a tutti

forse chiedo la luna ma è possibile, ad una determinata larghezza (esempio 719 px), sostituire in una determinata cella un'immagine con un'altra con il codice @media(mas-width 719px) o simile?

premetto che l'immagine da sostituire è richiamata nella cella con codice html (img src="images/...).

grazie

Publicado em
5 RESPOSTAS
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... io non ho il programma, ma secondo me potresti gestire semplicemente tramite le impostazioni mostra/nascondi previste nella configurazione dei breackpoint... 

... in extra, a grandi linee, ed in base alla struttura reale, se l'immagine la inserisci come sfondo (background), regolata quindi dal codice style css, allora potresti usare il media_query (@media)...

... se usi invece il tag img  potresti sostituire l'immagine tramite JavaScript...

.

Ler mais
Publicado em de  ‪ KolAsim ‪ ‪
Vittorio N.
Vittorio N.
User
Autor

Grazie uso il tag inglese e l immagine sta nel contenuto di una pagina. Mi puoi aiutare con il java?

Ler mais
Publicado em de Vittorio N.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... per esempio così:

<img id="immagine" src="immagine1.jpg">
<script> window.onload= function () { sostituisceK()}
window.onresize= function () { sostituisceK()}
function sostituisceK() {
var larghezza = window.innerWidth;
if (larghezza <= 800) {
document.getElementById("immagine").src = "immagine1.jpg";
} else {
document.getElementById("immagine").src = "immagine2.jpg";
} } </script>

.

Ler mais
Publicado em de  ‪ KolAsim ‪ ‪
Fabio B.
Fabio B.
User

da programma puoi inserire nel contenuto della pagina la stessa immagine in due misure diverse in due oggetti immagine contigui; poi gestisci la visualizzazione delle rispettive celle nei diversi breakpoint; le media-query te le genera il programma stesso senza metter mano ai codici

Ler mais
Publicado em de Fabio B.
Vittorio N.
Vittorio N.
User
Autor

grazie, proverò entrambe le soluzioni poi vi farò sapere

Ler mais
Publicado em de Vittorio N.