Visualizzazione dei risultati da 1 a 3 su 3
  1. #1
    Utente di HTML.it
    Registrato dal
    Feb 2007
    Messaggi
    154

    Limitare un testo a una certa lunghezza (in pixel)

    Ho un problema che mi sta dando qualche difficoltà: ho una pagina di questo tipo, dove l'intero testo deve stare su una sola riga, il tutto formattato con un carattere NON a spaziatura fissa.

    codice:
    <div id="container">
    	[Testo costante]
    	<span id="variabile">
    		[Primo parametro variabile]
    	</span>
    	[Altro testo costante]
    	<span id="variabile2">
    		[Secondo parametro variabile]
    	</span>
    </div>
    La questione è che non è conosciuta a priori la lunghezza dei due elementi variabili e che, specialmente su schermi piccoli, il tutto tende a essere troppo lungo e uscire dal layout.

    Quello che vorrei fare è avere una funzione in Javascript che taglia le parti variabili in funzione della dimensione della finestra (del browser), mantenendo quelle costanti inalterate e le dimensioni dell'insieme all'interno del layout.

    Esempio
    codice:
    <div id="container">
    	[Testo costante]
    	<span id="variabile">
    		[Primo parametr...]
    	</span>
    	[Altro testo costante]
    	<span id="variabile2">
    		[Secondo param...]
    	</span>
    </div>
    La mia prima idea è stata quella di usare

    codice:
    document.defaultView.getComputedStyle("variabile", "").width
    per ottenere la larghezza in pixel dello span, ma ho scoperto che funziona solo su elementi di tipo block.

    Grazie in anticipo a chiunque saprà rispondermi

  2. #2
    Moderatore di JavaScript L'avatar di br1
    Registrato dal
    Jul 1999
    Messaggi
    19,998
    Meglio di scomodare il javascript e' usare il css... overflow:hidden dovrebbe bastare
    Il guaio per i poveri computers e' che sono gli uomini a comandarli.

    Attenzione ai titoli delle discussioni: (ri)leggete il regolamento
    Consultate la discussione in rilievo: script / discussioni utili
    Usate la funzione di Ricerca del Forum

  3. #3
    Utente di HTML.it
    Registrato dal
    Feb 2007
    Messaggi
    154
    In effetti funziona, il problema è che nasconde sempre e comunque l'ultima parte della riga, mentre io voglio che le parti costanti restino visibili e che solo quelle variabili vengano troncate.

    Questo è il CSS che ho provato:
    codice:
    #container {
    max-width: 90%;
    overflow: hidden;
    }
    Se applico il codice qui sopra a #variabile e #variabile2 non funziona perché sono due span inline, mentre la larghezza si applica solo ai block e se gli applico "display: block;" mi sballa tutto il layout!

    Inoltre vorrei che la larghezza massima sia uguale alla dimensione della finestra meno x pixel, ma credo che questo vada fatto per forza con Javascript

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 © 2025 vBulletin Solutions, Inc. All rights reserved.