Torna indietro   Hardware Upgrade Forum > Software > Programmazione

Recensione Nothing Phone 4(a): sempre iconico ma ora più concreto
Recensione Nothing Phone 4(a): sempre iconico ma ora più concreto
Nothing con il suo nuovo Phone 4(a) conferma la sua identità visiva puntando su una costruzione che nobilita il policarbonato. La trasparenza resta l'elemento cardine, arricchita da una simmetria interna curata nei minimi dettagli. Il sistema Glyph si evolve, riducendosi nelle dimensioni ma aumentando l'utilità quotidiana grazie a nuove funzioni software integrate e notifiche visive. Ecco tutti i dettagli nella recensione completa
Corsair Vanguard Air 99 Wireless: non si era mai vista una tastiera gaming così professionale
Corsair Vanguard Air 99 Wireless: non si era mai vista una tastiera gaming così professionale
Nelle ultime settimane abbiamo provato la Corsair Vanguard Air 99 Wireless, una tastiera tecnicamente da gaming, ma che in realtà offre un ampio ventaglio di possibilità anche al di fuori delle sessioni di gioco. Flessibilità e funzionalità sono le parole d'ordine di una periferica che si rivolge a chi cerca un prodotto capace di adattarsi a ogni esigenza e ogni piattaforma
Ecovacs DEEBOT T90 PRO OMNI: ora il rullo di lavaggio è ampio
Ecovacs DEEBOT T90 PRO OMNI: ora il rullo di lavaggio è ampio
DEEBOT T90 PRO OMNI abbina un sistema di aspirazione basato su tecnologia BLAST ad un rullo di lavaggio dei pavimenti dalla larghezza elevata, capace di trattare al meglio le superfici di casa minimizzando i tempi di lavoro. Un robot completo che riesce anche ad essere sottile e garantire automazione ed efficienza nelle operazioni di pulizia di casa
Tutti gli articoli Tutte le news

Vai al Forum
Rispondi
 
Strumenti
Old 23-07-2014, 12:38   #1
digital_brain
Senior Member
 
L'Avatar di digital_brain
 
Iscritto dal: Jan 2003
Città: Roma Messaggi Totali:50333
Messaggi: 3519
Posizionare elemento javascript con CSS

Buongiorno,
vorrei posizionare degli elementi in javascipt in maniera precisa all'interno di una pagina html con i CSS, ma non so come applicare lo stile all'elemento desiderato.
Se ad esempio ho questo CSS:

Codice:
<style type="text/css">
	.test {
	position: absolute;
	height: 180px;
	width: 270px;
	left: 1100px;
	top: 140px;
}
	
</style>
come lo applico al codice javascript?
Grazie mille
__________________
Photo: Nikon D80 - Nikon 105Vr Micro + Nikon 70-300Vr + 18-135 + 50mm 1.8 + F65 + Canon S3 Is + Casio S600
Pc: Amd X2 6400+ - Asus M2N SLI Deluxe - 4 x 1Gb Corsair XMS2 800mHz cas 4 - Ati Hd 2600 Xt 512Mb ddr3 - Case TT Armor-Coolpanel2 Utenti con cui ho trattato
digital_brain è offline   Rispondi citando il messaggio o parte di esso
Old 23-07-2014, 12:48   #2
Daniels118
Senior Member
 
L'Avatar di Daniels118
 
Iscritto dal: Jan 2014
Messaggi: 852
Cosa sarebbe un elemento javascript? Vuoi forse dire un elemento html generato con javascript?
Gli attributi css si possono applicare in due modi, inline e tramite fogli di stile. Nel primo caso gli attributi vengono inseriti direttamente nel codice html, all'interno dell'attributo style; nel secondo invece l'associazione avviene tramite i selettori, che sono tanti ed è inutile elencarli qui, comunque i più importanti sono gli id e le classi.
Da javascript puoi impostare style, id e class con dei metodi appositi. Se usi jQuery o altri framework ci sono dei metodi più versatili e convenienti.
Daniels118 è offline   Rispondi citando il messaggio o parte di esso
Old 23-07-2014, 13:10   #3
digital_brain
Senior Member
 
L'Avatar di digital_brain
 
Iscritto dal: Jan 2003
Città: Roma Messaggi Totali:50333
Messaggi: 3519
Ciao,
intendo ad esempio questo:

Codice:
<div id= 'chart_div'>
    <script type='text/javascript' src='https://www.google.com/jsapi'></script>
    <script type='text/javascript'>
      google.load('visualization', '1', {packages:['gauge']});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Label', 'Value'],
          ['1', <?php echo $b ?>],
          ['2', <?php echo $res_310 ?>],
		  ['3', <?php echo $res_315  ?>],
		  ['4', <?php echo $cons_realtime_310 ?>],
		 
          
        ]);

        var options = {
          width: 1100, height: 400,
          redFrom: 4000, redTo: 5000,
          yellowFrom:3000, yellowTo: 4000,
          minorTicks: 5,
          majorTicks: 8,
          max: 5000,
          min: -5000
        };
		
		
		
	

        
      

        var chart = new google.visualization.Gauge(document.getElementById('chart_div'));
        chart.draw(data, options);
		
		
		
      }
    </script>
    </div>
è il codice per la visualizzazione di un "google chart" che vorrei poter posizionare a piacimento all'interno della pagina html

Grazie
__________________
Photo: Nikon D80 - Nikon 105Vr Micro + Nikon 70-300Vr + 18-135 + 50mm 1.8 + F65 + Canon S3 Is + Casio S600
Pc: Amd X2 6400+ - Asus M2N SLI Deluxe - 4 x 1Gb Corsair XMS2 800mHz cas 4 - Ati Hd 2600 Xt 512Mb ddr3 - Case TT Armor-Coolpanel2 Utenti con cui ho trattato
digital_brain è offline   Rispondi citando il messaggio o parte di esso
Old 23-07-2014, 13:36   #4
ndakota
Senior Member
 
L'Avatar di ndakota
 
Iscritto dal: Oct 2006
Città: milano
Messaggi: 1439
Con un'occhiata così al volo direi che ti basta assegnare la classe test al contenitore di quel codice per il chart, cioè a #chart_div.
ndakota è offline   Rispondi citando il messaggio o parte di esso
Old 23-07-2014, 13:37   #5
digital_brain
Senior Member
 
L'Avatar di digital_brain
 
Iscritto dal: Jan 2003
Città: Roma Messaggi Totali:50333
Messaggi: 3519
E' quello che ho provato a fare ma non ottengo il risultato sperato.
Come dovrei farla l'assegnazione della classe test esattamente?
__________________
Photo: Nikon D80 - Nikon 105Vr Micro + Nikon 70-300Vr + 18-135 + 50mm 1.8 + F65 + Canon S3 Is + Casio S600
Pc: Amd X2 6400+ - Asus M2N SLI Deluxe - 4 x 1Gb Corsair XMS2 800mHz cas 4 - Ati Hd 2600 Xt 512Mb ddr3 - Case TT Armor-Coolpanel2 Utenti con cui ho trattato
digital_brain è offline   Rispondi citando il messaggio o parte di esso
Old 23-07-2014, 14:08   #6
MicheleRaponi
Member
 
Iscritto dal: Oct 2003
Messaggi: 143
Quote:
Originariamente inviato da digital_brain Guarda i messaggi
E' quello che ho provato a fare ma non ottengo il risultato sperato.
Come dovrei farla l'assegnazione della classe test esattamente?
Se usi jQuery così: http://jsfiddle.net/Hs3w3/
MicheleRaponi è offline   Rispondi citando il messaggio o parte di esso
Old 23-07-2014, 14:32   #7
Daniels118
Senior Member
 
L'Avatar di Daniels118
 
Iscritto dal: Jan 2014
Messaggi: 852
Dal momento che il div è già nell'html e non viene generato da javascript basta che modifichi il tuo css utilizzando come selettore l'id del div, così:
Codice:
#chart_div {
	position: absolute;
	height: 180px;
	width: 270px;
	left: 1100px;
	top: 140px;
}
OPPURE aggiungi la classe test al div, così:
Codice:
<div id= 'chart_div' class="test">
Daniels118 è offline   Rispondi citando il messaggio o parte di esso
 Rispondi


Recensione Nothing Phone 4(a): sempre iconico ma ora più concreto Recensione Nothing Phone 4(a): sempre iconico ma...
Corsair Vanguard Air 99 Wireless: non si era mai vista una tastiera gaming così professionale Corsair Vanguard Air 99 Wireless: non si era mai...
Ecovacs DEEBOT T90 PRO OMNI: ora il rullo di lavaggio è ampio Ecovacs DEEBOT T90 PRO OMNI: ora il rullo di lav...
Recensione Samsung Galaxy S26 Ultra: finalmente qualcosa di nuovo Recensione Samsung Galaxy S26 Ultra: finalmente ...
Diablo II Resurrected: il nuovo DLC Reign of the Warlock Diablo II Resurrected: il nuovo DLC Reign of the...
Gli utenti Intel possono dire addio all'...
NVIDIA: raggiungeremo almeno 1 triliardo...
Lenovo presenta workstation e server con...
Nuova BMW i3: la Serie 3 elettrica debut...
NVIDIA torna in Cina: stretto un accordo...
Vibe coding nel mirino di Apple: ecco le...
Smart TV QLED 50'' a un super prezzo: 4K...
Horizon Worlds lascia i visori Quest: Me...
Lexar compie 30 anni e cambia le regole ...
Questo SSD fornisce memoria aggiuntiva a...
PlayStation Portal si aggiorna: arriva l...
Akamai, le API nel mirino dei cyber atta...
Spider-Man: Brand New Day, finalmente on...
La serie TV di Hitman è ufficialmente fe...
"Grazie e arrivederci": Sam Al...
Chromium
GPU-Z
OCCT
LibreOffice Portable
Opera One Portable
Opera One 106
CCleaner Portable
CCleaner Standard
Cpu-Z
Driver NVIDIA GeForce 546.65 WHQL
SmartFTP
Trillian
Google Chrome Portable
Google Chrome 120
VirtualBox
Tutti gli articoli Tutte le news Tutti i download

Strumenti

Regole
Non Puoi aprire nuove discussioni
Non Puoi rispondere ai messaggi
Non Puoi allegare file
Non Puoi modificare i tuoi messaggi

Il codice vB è On
Le Faccine sono On
Il codice [IMG] è On
Il codice HTML è Off
Vai al Forum


Tutti gli orari sono GMT +1. Ora sono le: 02:49.


Powered by vBulletin® Version 3.6.4
Copyright ©2000 - 2026, Jelsoft Enterprises Ltd.
Served by www3v