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

    Cambiare colore e dimensioni ad un bottone

    premetto che di codici di programmazione non ne capisco nulla, non so distinguere i vari html,css ecc..

    ho iniziato da poco a studiarli e sono praticamente alle basi.
    Ho creato un bottone che mostra del contenuto se ci clicchi sopra e vorrei cambiargli colore, altezza e larghezza ma non so come fare.

    il codice che uso è questo:
    codice:
    <script> 
    window.onload=function(){ 
    
    
    var event = document.getElementById("event"); 
    event.onclick=function(){ 
    var event = document.getElementById("event"); 
    var content = document.getElementById("contenuto"); 
    if(content.style.display == "none") { 
    content.style.display = ""; 
    event.innerHTML = "Nascondi"; 
    } 
    else { 
    content.style.display = "none"; 
    event.innerHTML = "Mostra"; 
    } 
    } 
    } 
    </script> 
    <button id="event">Mostra</button> 
    
    
    <div id="contenuto" style="display:none"> 
    blablabla 
    </div>
    Ultima modifica di ciro78; 15-02-2016 a 21:56 Motivo: titolo inadeguato e tag code

  2. #2
    Moderatore di Javascript L'avatar di ciro78
    Registrato dal
    Sep 2000
    residenza
    Napoli
    Messaggi
    8,514
    ciao e benvenuto sul forum,
    per le prossime discussioni leggi il regolamento in particolare la sezione che riguarda il titolo e l'utilizzo del tag code.
    per la prima volta ho modificato io.
    Ciro Marotta - Programmatore JAVA - PHP
    Preferisco un fallimento alle mie condizioni che un successo alle condizioni altrui.


  3. #3
    ciao, io ti consiglierei di utilizzare jquery che ti permette di ridurre il codice ed è molto pratico.
    inserisci questa riga di codice nel tag <head> per poter utilizzare jquery:
    codice HTML:
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    per inserire un bottone conviene utilizzare il tag input invece del div, anche se con javascript tutto è possibile.
    ti riporto un esempio:

    codice HTML:
    <input type="button" id="btn" value="Test"  style="width:100px;" />
    <script type="text/javascript">
         $("document").ready(function() {   
               $("#btn").click(function() {
                     $(this).val("Test modificato");
                     $(this).css("background-color", "red");
                     $(this).css("color", "white");
                     $(this).css("width", "200px");
               });
         });
    </script>

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.