Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- .slide{
- position:relative;
- width:1000px;
- height:700px;
- margin:0auto;
- }
- .slide img {
- position: absolute;
- }
- .content-switcher{
- display:none;
- }
- .clicarinicio {
- width: 130px;
- height: 100px;
- border: 5px solid #FF0000;
- position: absolute;
- display:none;
- bottom:0;
- }
- .clicarinicio2 {
- width: 130px;
- height: 100px;
- border: 5px solid blue;
- position: absolute;
- display:none;
- top:0;
- }
- <div class="slide">
- <div class="content-switcher" id="Content1">
- <img src="img/1inicio.jpg" style="height:100%;" />
- <div class="mostraBox" style="display:none;width:100px;height: 20px; right:0; position: absolute; color: white;">Clique no botao Iniciar</div>
- <div class="clicarinicio"></div>
- </div>
- <div class="content-switcher" id="Content2">
- <img src="img/2botao.jpg" style="height:100%;" />
- <div class="mostraBox2" style="display:none;width:100px;height: 20px; right:0; position: absolute; color: white;">Abriu o painel! Clique em Alguma coisa</div>
- <div class="clicarinicio2"></div>
- </div>
- </div>
- $(document).ready(function () {
- selectStep(1);
- $('.clicarinicio').on('click', function () {
- return selectStep(2);
- });
- }); //FIM DE DOCUMENT READY
- function selectStep(n) {
- if (n == 1) {
- $('.clicarinicio').fadeIn("slow").delay(3000).show();
- $('.mostraBox').fadeIn("slow").delay(10000).show();
- }
- if (n == 2) {
- $('.clicarinicio2').fadeIn("slow").delay(3000).show();
- $('.mostraBox2').fadeIn("slow").delay(10000).show();
- }
- $(".content-switcher").hide();
- $("#Content" + n).show();
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement