Jump to content
Sign in to follow this  
Maxilboss93

How to load page in div compatible with all device?

Recommended Posts

I have a problem with .load() of jquery, or use of frame;

I need to load in a div a page that loads its data dynamically through javascript, in particular I have my html page which through a js in a function uses the .load of jquery:

this is an example of my problem:

 

<!doctype html>
<html lang="it">

<head>
    <script defer class="sezioni"></script>
    <script src="assets/js/jquery.js"></script>

    <!--META-->
    <meta charset="utf-8">
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        div#ese_div_book {
            position: absolute;
            width: 100px;
            height: 100px;
            background: midnightblue;
        }
    </style>
</head>

<body>
    <div id="ese_div_book" class="ese_button ese_quiz ese_colorBT2">
        <img id="ese_book" class="myButton" src="assets/img/Bt_Book.svg">
    </div>
    <div id="contenitore_libro" style="position: fixed;width: 100%;height:100%;top: 0%;left: 0%;z-index: 999999999;visibility: hidden;">
        <iframe id="frame" src="" style="width: 100%;height: 100%;">
        </iframe>
        <button id="button_book" class="ese_button ese_quiz ese_colorBT1 ese_norm" style="visibility: hidden;position: fixed;top: 95%;width: 5%;height: 5%;left: 95%;background-color: lightskyblue;">
            <img id="ese_back" class="myButton" src="assets/img/menu/IndietroW.svg">
        </button>

    </div>

</body>

<script>
    $("#ese_div_book").click(function() {
        $("#contenitore_libro").css("visibility", "visible");
        $("#button_book").css("visibility", "visible");
        // console.log("ARRIVA VALORE", _nQuest);
        $("#frame").attr("src", "../librohtml/index.html?id=" + _nQuest.Libro3 + "&=yes&lis=AB");

    });
    $("#button_book").click(function() {
        $(this).css("visibility", "hidden");
        $("#contenitore_libro").css("visibility", "hidden");
        return false
    })
</script>

</html>

 

with Frame not function correctly in Apple device; if I try to use the .load() of jquery not load the div sezioni that was a js loaded dinamically by 

 <script defer class="sezioni"></script>

and other file .js,

Any ideas to load the page in a div with all his js?? 

Share this post


Link to post
Share on other sites

That is a terrible idea. The <object> tag is not very good at displaying websites, while the <iframe> is designed for that purpose.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...