/    Sign up×
Community /Pin to ProfileBookmark

Javascript with Iframes

Copy linkTweet thisAlerts:
Mar 20.2010

I have designed 3 iframes and I have been making the navigation bar with CSS/XHTML but the results are quite heavy

What I have is:

———————

Navigation Iframe
———————


Content Iframe
———————


Footer Iframe
———————

[LIST=1]

  • [*]

    The “navigation” Iframe contain the navigation bar and this should let me click and : go to START, PREVIOUS page, NEXT page, LAST page, PRINT Page, and SHOW a PDF of the actual page.

  • [*]

    Every page requested in the “navigation” iframe will be deployed in the “content” Iframe

  • [*]

    Ammount of pages: 5 pages


  • [*]

    I have 5 pdf

  • [*]

    If I design this just with XHTML and CSS will work in everypage BUT will be quite heavy


    • [/LIST]

    I wonder if I could do the same in JavaScript and using iframe??

    Thank you for everything

    to post a comment
    JavaScript

    6 Comments(s) ↴

    Copy linkTweet thisAlerts:
    @zidaine_38Mar 21.2010 — Maybe you need to learn more about framesets. This is much easy to handle than iframes.


    http://www.w3.org/TR/html4/present/frames.html


    Learn about targeting to content frame from navigation frame
    Copy linkTweet thisAlerts:
    @MikerssonauthorMar 21.2010 — Frames do not helps to the accesibility more than iframes, then I can still looking for the right code.

    I apreciate so much your contribution.
    Copy linkTweet thisAlerts:
    @FangMar 21.2010 — Why do you consider CSS/XHTML to be a 'heavy' solution, compared to JavaScript?
    Copy linkTweet thisAlerts:
    @MikerssonauthorMar 21.2010 — If you think XHTML/CSS its an easier solution accord what I need, then you should post the easier way it is rather than ask me what you ask.

    Havent you read the context I said?

    ---

    # The "navigation" Iframe contain the navigation bar and this should let me click and : go to START, PREVIOUS page, NEXT page, LAST page, PRINT Page, and SHOW a PDF of the actual page.


    ---

    IF you can do this avoiding JAvaScript, I'll apreciate you could write and let me understand that is not heavy just by XHTML/CSS

    Thank you
    Copy linkTweet thisAlerts:
    @FangMar 21.2010 — I have designed 3 iframes and I have been making the navigation bar with CSS/XHTML but the results are quite heavy[/QUOTE]You write it has been designed and is heavy. Why would adding JavaScript on top of your code make it less 'heavy'?

    Without seeing the existing design, we can not see how to improve it.
    Copy linkTweet thisAlerts:
    @MikerssonauthorMar 21.2010 — If I want to use a NEXT PAGE link in 5 pages by using "iframes" will not be a problem just by BUT if you ned much more pages , then I think JAvaScript code will help a lot

    This is the code:



    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>Untitled Document</title>

    <style type="text/css">

    <!--

    @import url("css/arm.css");

    -->

    </style>

    <script Language="javascript">

    function printfile()

    {

    window.frames['pictures'].focus();

    window.frames['pictures'].print();

    }

    </script>

    |

    </head>

    <body>

    <div id="wrapper">

    <div id="header">

    <iframe id="header" src="header.html" ></iframe>

    </div>

    <div id="content">

    <iframe id="pictures" src="arm001.html" Scrolling="no"> </iframe>

    </div>

    <div id="footer"><iframe id="footer" src="footer.html" > </iframe></div>

    </div>

    </body>

    </html>
    [/QUOTE]
    The look U can see it here:

    http://www.pixelperu.net/iframe/iframe.jpg/iframe

    The content should be showed in the Iframe content

    The header iframe have next code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>Untitled Document</title>

    <style type="text/css">@import url("css/arm.css");</style>

    </head>

    <body>

    <div id="header">

    <div class="navBar">First Page | Next page | Back page | Last page | <p><input type="button" value="Print" onclick="javascript: printfile();"></p></div>

    </body>

    </html>[/QUOTE]

    I hope you can get what I mean.

    Thank you in advance.
    ×

    Success!

    Help @Mikersson spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 — BETA 5.21,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,

    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,
    )...