Código HTML:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta name="description" content="pagina principal de la app"> <meta name="author" content="#"> <link rel="shortcut icon" href="http://pagina.ejemplo/favicon.png"> <link rel="stylesheet" href="css/base.css" type="text/css"> <link rel="stylesheet" href="css/hmbrgr.min.css" type="text/css"> <script type="text/javascript"> function SINO(cual) { var elElemento=document.getElementById(cual); if(elElemento.style.display == 'block') { elElemento.style.display = 'none'; } else { elElemento.style.display = 'block'; } } </script> </head> <title>pagina</title> <style type="text/css"> /* preloader */ #preloader { position: fixed; top:0; left:0; right:0; bottom:0; background: #000; z-index: 100; } #loader { width: 100px; height: 100px; position: absolute; left:50%; top:50%; background: url(http://pagina.ejemplo/img/loader.gif) no-repeat center 0; margin:-50px 0 0 -50px; } </style> <!-- Bootstrap theme --> <link href="css/bootstrap.css" rel="stylesheet"> <link href="http://www.pagina.ejemplo/media/menu.css" rel="stylesheet"> <link href="css/theme.css" rel="stylesheet"> <link href="css/styles.css" rel="stylesheet"> <link rel="stylesheet" href="css/base.css" type="text/css"> </head> <style> #iframe{position:absolute;left:0px;top:0px;} </style> <body style="overflow-y:hidden"> <div id="preloader"> <div id="loader"> </div> </div> <div id="main"> <div id="js-menu" class="navbar navbar-inverse navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <div class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <a href="#" class="hmbrgr one"></a> </div> <input class="buttomback" type="button" onclick="history.back()" value="<"> <span class="logomenu"> <div align="center"> <img src="http://www.pagina.ejemplo/media/logowhite.png"> </div> </span> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li> <a class="text-menu" href="javascript:void(0);" onclick="SINO('ifrm-inicio')">Inicio</a></li> <li> <a class="text-menu" href="javascript:void(0);" onclick="SINO('ifrm-ofertas')">Ofertas</a></li> <li> <a class="text-menu" href="javascript:void(0);" onclick="SINO('ifrm-tiendas')">Tiendas</a></li> <li> <a class="text-menu" href="javascript:void(0);" onclick="SINO('ifrm-hoteles')">Hoteles</a></li> </ul> </div> </div> </div> <div id="ifrm-inicio" style="display:none;"> <iframe id="iframe1" name="iframe1" frameborder="0" width="100%" height="100%" src="http://www.pagina.ejemplo/incio"></iframe> </div> <div id="ifrm-ofertas" style="display:none;"> <iframe id="iframe2" name="iframe2" frameborder="0" width="100%" height="100%" src="http://www.pagina.ejemplo/ofertas"></iframe> </div> <div id="ifrm-tiendas" style="display:none;"> <iframe id="iframe3" name="iframe3" frameborder="0" width="100%" height="100%" src="http://www.pagina.ejemplo/tiendas"></iframe> </div> <div id="ifrm-hoteles" style="display:none;"> <iframe id="iframe4" name="iframe4" frameborder="0" width="100%" height="100%" src="http://www.pagina.ejemplo/hoteles"></iframe> </div> <script type=”text/javascript”> function redireccionar() { alert(‘Requiere acceso a internet’); history.back(1); } </script> <script src="js/jquery.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/index.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script type="text/javascript"> $(window).load(function() { $('#preloader').fadeOut('slow'); $('body').css({'overflow':'visible'}); }) </script> <script src="js/jquery.hmbrgr.js"></script> <script> $('.hmbrgr.one').hmbrgr(); </script> </body> </html>