Advertisement
Guest User

Untitled

a guest
Dec 9th, 2016
66
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.05 KB | None | 0 0
  1. .slide{
  2. position:relative;
  3. width:1000px;
  4. height:700px;
  5. margin:0auto;
  6. }
  7. .slide img {
  8. position: absolute;
  9.  
  10. }
  11. .content-switcher{
  12. display:none;
  13. }
  14.  
  15. .clicarinicio {
  16. width: 130px;
  17. height: 100px;
  18. border: 5px solid #FF0000;
  19. position: absolute;
  20. display:none;
  21. bottom:0;
  22.  
  23. }
  24.  
  25. .clicarinicio2 {
  26. width: 130px;
  27. height: 100px;
  28. border: 5px solid blue;
  29. position: absolute;
  30. display:none;
  31. top:0;
  32.  
  33. }
  34.  
  35. <div class="slide">
  36. <div class="content-switcher" id="Content1">
  37. <img src="img/1inicio.jpg" style="height:100%;" />
  38. <div class="mostraBox" style="display:none;width:100px;height: 20px; right:0; position: absolute; color: white;">Clique no botao Iniciar</div>
  39. <div class="clicarinicio"></div>
  40.  
  41. </div>
  42.  
  43. <div class="content-switcher" id="Content2">
  44. <img src="img/2botao.jpg" style="height:100%;" />
  45. <div class="mostraBox2" style="display:none;width:100px;height: 20px; right:0; position: absolute; color: white;">Abriu o painel! Clique em Alguma coisa</div>
  46. <div class="clicarinicio2"></div>
  47.  
  48. </div>
  49.  
  50.  
  51.  
  52.  
  53. </div>
  54.  
  55. $(document).ready(function () {
  56.  
  57. selectStep(1);
  58.  
  59. $('.clicarinicio').on('click', function () {
  60. return selectStep(2);
  61. });
  62.  
  63.  
  64. }); //FIM DE DOCUMENT READY
  65.  
  66.  
  67. function selectStep(n) {
  68.  
  69.  
  70. if (n == 1) {
  71.  
  72. $('.clicarinicio').fadeIn("slow").delay(3000).show();
  73. $('.mostraBox').fadeIn("slow").delay(10000).show();
  74. }
  75.  
  76. if (n == 2) {
  77.  
  78. $('.clicarinicio2').fadeIn("slow").delay(3000).show();
  79. $('.mostraBox2').fadeIn("slow").delay(10000).show();
  80. }
  81.  
  82. $(".content-switcher").hide();
  83. $("#Content" + n).show();
  84. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement