HabboLife Forum
Vuoi reagire a questo messaggio? Crea un account in pochi click o accedi per continuare.

HabboLife ForumAccedi

Habbolife Forum è un fansite ufficiale di Habbo hotel. Rimani aggiornato sulle notizie di questo magnifico mondo virtuale e sugli ultimi argomenti di attualità!

Piccolo problema informatico

power_settings_newAccedi per rispondere
5 partecipanti

descriptionPiccolo problema informatico EmptyPiccolo problema informaticoSab 4 Feb 2017 - 18:48

more_horiz
Salve a tutti ragazzi, apro questa discussione (su consiglio di tia, con cui ho gia parlato dandomi qualche dritta) per esporre il mio piccolo problema. Premetto che so poco e niente dei vari linguaggi di programmazione e anzi in generale non sono molto ferrato in ambito informatico; detto questo mia sorella (lei sa peggio di me) deve svolgere una ricerca scolastica e aveva intenzione di inserire delle immagini con il testo che appariva al passaggio del mouse, il problema sorge nel font di questo testo, nel senso scrivere una parte di esso in grassetto. Tia mi ha sottolineato il fatto che attraverso il linguaggio HTML (che è quello che uso principalmente quando serve) non è possibile fare ciò, consigliandomi di passare al linguaggio CSS e ad altre soluzione un po' più elaborate. Ora vi chiedo (a tutti coloro che se la cavicchiano almeno un po' in questo ambito) se c'è qualcuno che possa aiutarci magari spiegando qualche passaggio e/o inviandomi dei codici fondamentali per poter riuscire in questa piccola impresa. Ringrazio a chi mi aiuterà Piccolo problema informatico 2800533321 Piccolo problema informatico 3145629459

Ultima modifica di symon96 il Sab 4 Feb 2017 - 23:01 - modificato 1 volta.

descriptionPiccolo problema informatico EmptyRe: Piccolo problema informaticoDom 5 Feb 2017 - 12:06

more_horiz
Per prima cosa nei tag <head></head> devi mettere i seguenti codici (le parti in grassetto sono quelle che puoi cambiare):
immagine1 {
float: left;
background-image: url('Link immagine senza testo');
height: altezza immagine in pixel (esempio: 56px);
width: larghezza immagine in pixel (esempio: 56px);
}
immagine1:hover {
background-image: url('link immagine');
}



Poi nel body metteti il seguente codice:
<div id="immagine1_popup" style="display: none;
background-color: rgba(mettere colore dello sfondo del box dove si vuole la scritta in rgba);
border: 5px solid rgba(0, 0, 0, 0.2);
width: grandezza del box del messaggio;
float: right;
height: 50px;
border-radius: 10px;
position: relative;
top: distanza dall'alto della pagina in pixel (es: 50px);
left: distanza dal bordo sinistro della pagina in pixel (es. 50px);
color: rgba(0, 0, 0, 0.7);
font-size: grandezza del font di scrittura;
padding: 10px;
text-align: center;
z-index: 9000;">

<table style="width:100%;
height:100%;">
<tr><td><cufontext>Testo che si vuole che  compaia</cufontext></td></tr></table>
</div>



In teoria è tutto se hai problemi scrivvimi un mp che solitamente non rileggo i commenti alle vecchie conversazioni Piccolo problema informatico 1826136131 

descriptionPiccolo problema informatico EmptyRe: Piccolo problema informaticoDom 5 Feb 2017 - 15:33

more_horiz
Ho voluto provarne a fare una versione anche io poi sta a te scegliere qual'e' meglio per il tuo fine Piccolo problema informatico 126469808

Codice:

<style>
.testo{
  display:none;
  font-weight:bold;
  width:100%;
}

.imgtesto{
  width:500px;
  height:500px;
  background:url("URL IMMAGINE") no-repeat;
  background-size: cover;
  text-align:center;
  overflow:hidden;
}

.imgtesto:hover .testo{
  display:block;
  cursor:pointer;
}
</style>
<div class="imgtesto"><div class="testo">Testo immagine</div></div>

descriptionPiccolo problema informatico EmptyRe: Piccolo problema informaticoDom 5 Feb 2017 - 23:56

more_horiz
Grazie mille ad entrambi, proverò i metodi e vi farò sapere Piccolo problema informatico 1765539963

descriptionPiccolo problema informatico EmptyRe: Piccolo problema informaticoLun 6 Feb 2017 - 14:46

more_horiz
Ehi ciao Piccolo problema informatico 1182390374 il metodo suggerito da megabillas penso possa andar bene, poi ovviamente tramite CSS e HTML uno lo modifica ottenendo il risultato finale desiderato!

Altrimenti, come ti dicevo, un'altra soluzione sarebbe usare i tooltip, però c'è bisogno anche di un po' di javascript e inoltre anche in questo caso spesso il contenuto del tooltip non risente della formattazione.

Facci sapere se hai avuto difficoltà, dubbi o hai bisogno di qualche consiglio su come migliorare il precedente codice (specialmente in relazione all'immagine da te usata)

descriptionPiccolo problema informatico EmptyRe: Piccolo problema informaticoVen 10 Feb 2017 - 15:43

more_horiz
Grazie mille a tutti, dopo un po' di fatica e problemini su alcuni punti ci siamo riusciti Piccolo problema informatico 2762549214 Piccolo problema informatico 353657295 Piccolo problema informatico 3555456103

descriptionPiccolo problema informatico EmptyRe: Piccolo problema informaticoSab 11 Feb 2017 - 20:07

more_horiz
Se il problema sia risolto, penso si possa chiudere, vero? Piccolo problema informatico 1437316102 @Simone @Mattia
privacy_tip Permessi in questa sezione del forum:
Non puoi rispondere agli argomenti in questo forum.
power_settings_newAccedi per rispondere