Messaggio pubblicitario non responsive 
Author: Antonino B.Buon pomeriggio a tutti, vorrei sapere se il messaggio pubblicitario deve essere realizzato in qualche modo specifico per essere responsive, per essere chiaro....ho realizzato una immagine 960x150px e l'ho utilizzata per il messaggio pubblicitario su barra orizzontale>alto, ma mi sono reso conto che se visualizzo con uno smartphone in posizione verticale la barra del messaggio viene visualizzata parzialmente, mentre se metto lo smartphone in posizione orizzontale si visualizza correttamente, inoltre sul computer, se scendo sotto la visualizzazione PC comincia a vedersi parzialmente, secondo voi la soluzione giusta potrebbe essere quella di diminuire le dimensioni dell'immagine ad esempio 480x75px? A scapito del'impatto visuale del messaggio, oppure la strada corretta è un'altra? Grazie.
Buongiorno Antonino,
potresti per favore comunicarmi l'url del tuo sito così da poter verificare?
Fammi sapere.
Author
Eccolo scusa il ritardo....www.dacor.it il sito è un'altro ma il problema è lo stesso, l'immagine è 1920 lunghezza e il banner è in basso, ma come vedi non si ridimensiona (no responsive)!
Buongiorno Antonio,
dovresti ridurre l'immagine e inserirne una che si veda correttamente anche nella visualizzazione responsive. L'immagine inserita li non si ridimensiona.
Riccardo, ciao. L'immagine pubblicitaria in riquadro però si ridimensiona. Credo sarebbe opportuno fare in modo che anche quella inserita nella barra (in alto o in basso) si ridimensioni usando il sistema adottato per quella in riquadro. Dovrebbe essere messo come post idea questo post. Ciao
prova con questo css, da mettere nelle proprietà della pagina... ti anticipo che non l'ho provato da programma ma solo online sul sito che hai linkato... quindi devi provare tu... aggiustando la percentuale in base a cosa ti serve...
<style>
#bottom-alertbox-container img {width:30% !important;}
</style>
P.S. - il ink che hai postato ho notato che ha un problema con questo messaggio pubblicitario che si sovrappone alle scritte sullo sfondo generando confusione...
Author
Ciao Skeggia 12, nel frattempo ho cambiato il banner mettendone uno molto più piccolo, ma viene meno quello che volevo ottenere, appena posso provo ad inserire il codice che mi indichi, poi ti faccio sapere, magari aspetto a chiudere ilm post. Per quanto riguarda l'osservazione di Giuseppe, che faccio provo a creare un post IDEA oppure ci pensi tu Riccardo?
Author
Skeggia 12, allora ho provato ad inserire il codice che mi hai consigliato e sembra funzionare correttamente, l'unica cosa che potrebbe stonare, se vogliamo essere pignoli e che più si diminuisce la dimensione piu il banner si posiziona leggermente in alto e non in fondo alla pagina, ho provato ad inserirlo sia "subito dopo l'apertura del body" che all'interno dell'HEAD (varie posizioni) pensando evidentemente erroneamente che potesse cambiare qualcosa, ma il comportamento è lo stesso, comunque può sicuramente andare anche così, grazie!
... come idea EXTRA, con il mio DIV_CUSTOM che già conosci, con un copia/incolla potresti ottenere >> questo effetto ...(provvisorio!!)...
.
Author
Buongiorno KolAsim, ti riferisci alla "X" di chiusura sulla destra?
Author
Ti chiedo una cosa, se volessi per esempio invece del pallino giallo inserire una immagine di un palloncino con una "X", per rimanere nel tema del sito? Quali cambiamenti dovrei fare al codice?
Author
Ho provato a utilizzare il codice, ma la "X" noto che è leggermente spostata in alto in relazione allo sfondo giallo, non riesco a individuare il parametro per abbassarla..
... basta aggiungere l'immagine nel TAG <A>: ...puoi rivedere l'esempio aggiornato, ancora disponibile...
Ho provato a utilizzare il codice, ma la "X" noto che è leggermente spostata in alto in relazione allo sfondo giallo, non riesco a individuare il parametro per abbassarla..
... nel mio esempio non risulta, come puoi constatare; ...comunque basta controllare il valore della coordinata TOP...
... eventualmente per poter valutare posta il LINK del tuo esempio...
.
Puoi aggiungere, al CSS postato da Skeggia, questa regola:
#alertbox-advcorner, .message-container {
height:auto !important;
}
Qui sotto il banner dopo la correzione:
Comunque sono d'accordo con Giuseppe Guida, questo è un bug e va sistemato a monte.
[OT]
Nell'header hai inserito un oggetto che "sborda", correggi la sua posizione nei vari breakpoint.
Author
Scusa KolAsim, ma mi sono perso, non riesco a trovare il punto dove inserire l'immagine del palloncino e soprattutto come inserire i parametri di posizionamento sia dell'immagine che della "X", ho provato a vedere il tuo precedente esempio (che avevo salvato) ma mi confondo ancora di più, perchè li tu hai creato i parametri del fondo giallo, che non mi servono. Ti allego quello che vorrei avere al posto della semplice "X" con sfondo giallo.
Author
Grazie lemonsong, adesso funziona veramente bene, anche su smartphone!
... ottimo il modo con cui hai risolto...
... ma se invece ti servissero chiarimenti su >> questo ancora attuale esempio, ...fatti risentire...
.
Prego, ma è solo una "toppa" in attesa di "miglioramenti" da programma.
In alcuni casi il CSS potrebbe essere "sovrascritto" da JS.
Author
Ok ragazzi, vi ringrazio per tutto. KolAsim sono ancora interessato al tuo esempio, ma come ti accennavo avrei bisogno di un'ulteriore aiuto, ti ho inviato l'immagine del palloncino che vorrei prendesse il posto del cerchietto che racchiude la "X" e posizionare la "X" sopra di esso! Vorrei provare a fare qualcosa di diverso invece che le solite "X"
>> vedi
.
Author
Grazie KolAsim, mi avete aiutato "parecchio" a sistemare un po di cosette!!!
...
...
Author
Scusa KolAsim, ho dovuto riaprire il post perchè mi sono reso conto dopo che c'è qualcosa che non va, infatti se clicco sul palloncino il banner non si chiude, ma sparisce il palloncino e si vede la "x" sottostante, quindi se clicco su quella "x" allora si chiude il banner, ho riguardato il codice svariate volte ma non capisco dov'è l'inghippo!
... ho recuperato l'esempio che nel frattempo si era estinto, >> questo ... (24-48 h)...
... vedi e prova se ti funziona a regola e fammi sapere...
... eventualmente posta anche il link della pagina in cui stai provando per verificare...
.
Author
Buongiorno KolAsim, ho visto, bello l'accorgimento del palloncino a metà tra il banner e lo sfondo, è un dettaglio ma fa un bel effetto, comunque non funziona ancora, se chiudo il palloncino non si chiude il banner.
https://www.dacor.it/index.html
...!... hai due banner sovrapposti, quello del programma ed il mio in extra...!...
... chiudendo dal palloncino si elimina il mio div_custom extra, ed appare quello del programma sottostante...
... quindi devi decidere quale dei due metodi usare...
... se userai la mia invenzione, potresti fare in modo di utilizzare un banner più adatto per le risoluzioni inferiori; ...nel caso ti interessasse vedi e prendi da questa >variante dell'esempio(800px)...(!)...
.
Author
Ok, pensavo che il codice interagisse con ciò che era stato inserito in "messaggio pubblicitario" quindi ho capito se decido di usare il tuo non devo fare altro che inserire gli stessi percorsi delle immagini, ma nel codice! Penso che l'equivoco è nato quando si parlava di cambiare solo la "X" Dopo provo e ti faccio sapere!
Author
Allora funziona, ma ho optato per la prima versione, grazie ancora!
... OK, ...è un'ottima soluzione ...