Jump to content

Senior

Members
  • Posts

    2
  • Joined

  • Last visited

Posts posted by Senior

  1. How can I make the panel's text disappear when it is hiding and the text is displayed when the panel is showing? Thank you

     

     

    I'm sorry for my English
    
     

     

    <!DOCTYPE html>
     
    <html>
    <head>
    <style>
    #panel, #flip {
    padding: 5px;
    text-align: center;
    background-color: #e5eecc;
    border: solid 1px #c3c3c3;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    -o-user-select:none;
    user-select:none;
    }
    #panel {
    padding: 50px;
    display: none;
    }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
    $("#flip").click(function(e){
    e.preventDefault();
    $("#panel").stop();
    $("#panel").slideToggle("slow");
    mostrarFrases();
    });
    mostrarFrases();
    });
    </script>
    <script>
    var Frases=new Array()
    Frases[0] = "Si en los inicios no puedes alimentar a tu equipo con 2 pizzas, es que es demasiado grande – Jeff Bezos de Amazon.";
    Frases[1] = "El valor de una idea radica en el uso de la misma – Thomas Edison.";
    Frases[2] = "El trabajo va a ocupar gran parte de tu vida. La única forma de estar realmente satisfecho es hacer aquello que crees que es un buen trabajo, y la única forma de hacer un gran trabajo es amar aquello que haces – Steve Jobs de Apple.";
    Frases[3] = "Tus clientes más insatisfechos deben ser tu mayor fuente de aprendizaje – Bill Gates";
    Frases[4] = "Una visión de una idea sin la capacidad de ejecución es únicamente una alucinación – Steve Case de AOL.";
    var Q = Frases.length;
     
    function mostrarFrases() {
    var numAleatorio=Math.round(Math.random()*(Q-1));
    document.getElementById("panel").innerHTML=Frases[numAleatorio];
    }
    </script>
    </head>
    <body>
    <div id="flip">Click to slide the panel down or up</div>
    <div id="panel">Hello world!</div>
    </body>
    </html>

     

  2.  

    How can I make the panel's text disappear when it is hiding and the text is displayed when the panel is showing? Thank you

     

    <!DOCTYPE html>
     
    <html>
    <head>
    <style>
    #panel, #flip {
    padding: 5px;
    text-align: center;
    background-color: #e5eecc;
    border: solid 1px #c3c3c3;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    -o-user-select:none;
    user-select:none;
    }
    #panel {
    padding: 50px;
    display: none;
    }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
    $("#flip").click(function(e){
    e.preventDefault();
    $("#panel").stop();
    $("#panel").slideToggle("slow");
    mostrarFrases();
    });
    mostrarFrases();
    });
    </script>
    <script>
    var Frases=new Array()
    Frases[0] = "Si en los inicios no puedes alimentar a tu equipo con 2 pizzas, es que es demasiado grande – Jeff Bezos de Amazon.";
    Frases[1] = "El valor de una idea radica en el uso de la misma – Thomas Edison.";
    Frases[2] = "El trabajo va a ocupar gran parte de tu vida. La única forma de estar realmente satisfecho es hacer aquello que crees que es un buen trabajo, y la única forma de hacer un gran trabajo es amar aquello que haces – Steve Jobs de Apple.";
    Frases[3] = "Tus clientes más insatisfechos deben ser tu mayor fuente de aprendizaje – Bill Gates";
    Frases[4] = "Una visión de una idea sin la capacidad de ejecución es únicamente una alucinación – Steve Case de AOL.";
    var Q = Frases.length;
     
    function mostrarFrases() {
    var numAleatorio=Math.round(Math.random()*(Q-1));
    document.getElementById("panel").innerHTML=Frases[numAleatorio];
    }
    </script>
    </head>
    <body>
    <div id="flip">Click to slide the panel down or up</div>
    <div id="panel">Hello world!</div>
    </body>
    </html>

     

×
×
  • Create New...