Visualizzazione dei risultati da 1 a 4 su 4
  1. #1
    Utente di HTML.it
    Registrato dal
    Apr 2016
    Messaggi
    2

    Come far cambiare immagine e link ad ogni refresh

    Ciao a tutti,
    ho un codice html con una semplice immagine con un link, in cui cliccando all'immagine si va appunto al link esterno. Ora vorrei fare in modo che questa immagine ed link annesso cambiasse ogni volta che si ricarichi la pagina, quindi se sono due fa vedere al 50% l'una ed al 50% l'altra; se sono tre ne fa vedere al 33% l'una, al 33% la seconda ed al 33% la terza e così via.
    Come si può fare?
    Grazie

  2. #2
    Utente di HTML.it L'avatar di ninja72
    Registrato dal
    May 2020
    residenza
    -
    Messaggi
    177
    Potresti crearti una funzione javascript che punta al tuo elemento DOM. (id ="banner" nel mio caso)

    codice:
     const banner = document.getElementById('banner')
    
            // dati ritornati da una ipotetica fetch / ajax
            const objData = [
                {
                    src: 'img1.jpg',
                    url: 'https://www.google.it'
                },
                {
                    src: 'img2.jpg',
                    url: 'https://www.ansa.it'
                }
            ]
    
            const bannerRnd = (obj) => {
                const rnd = Math.random() * obj.length | 0
                const data = obj[rnd]
    
                const link = document.createElement('a')
                const image = document.createElement('img')
    
                link.setAttribute('href', data.url)
                link.setAttribute('target', '_blank')
    
                image.setAttribute('src', data.src)
    
                link.appendChild(image)
                banner.appendChild(link)
    
            }
            bannerRnd(objData)

  3. #3
    Utente di HTML.it
    Registrato dal
    Apr 2016
    Messaggi
    2
    Quote Originariamente inviata da ninja72 Visualizza il messaggio
    Potresti crearti una funzione javascript che punta al tuo elemento DOM. (id ="banner" nel mio caso)

    Eh, ma non so se è concesso usare javascript, per quello cercavo una soluzione in HTML...

  4. #4
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,095
    html è solo il linguaggio di marcatura, non è in grado di generare azioni sul client.
    e non è nemmeno suo compito.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.