Cómo puedo hacer que el texto del panel desaparezca cuando este se esté escondiendo
Publicado por Sañor V (4 intervenciones) el 26/12/2018 21:16:49
¿Cómo puedo hacer que el texto del panel desaparezca cuando este se esté escondiendo y que el texto aparezca cuando el panel se esté mostrando?
Muchas Gracias
Muchas Gracias
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<!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>
Valora esta pregunta


0