5 Replies Latest reply: Apr 15, 2012 9:45 PM by Ben Pleysier RSS

    Navigating from a web page with a bottom frame to a new page without the bottom frame

    jasongreenberg Community Member

      I am building a webpage that has a bottom frame that shows the mp3 player controls for several pages that have musical content.  The problem is that when I want to navigate to a new page within my web page the bottom web frame remains there and screws up the links on that page.  How can I go from a page that has a frameset with an upper and lower frame and then click a link to a new page that should only have a single frame with no bottom frame.  It seems that any web link I click on from the page with the bottom frame, the new web page that I arrive at will continue to have the same bottom frame.  How do I get rid of this bottom frame for new web links that I click on from the page with the frameset?

       

      Thanks for any help.

       

      Jason

        • 2. Re: Navigating from a web page with a bottom frame to a new page without the bottom frame
          sudarshan.t Community Member

          @Gramps - very well said in your link - 'Frames are evil'!

           

          Jason, Frames are vintage. Why don't you CSS your page fully? This should resolve your issue and will also make your page more 'new-age'.

           

          There are tons of tutorials online on how you could have a static media controller to control all your page's media elements.

          • 3. Re: Navigating from a web page with a bottom frame to a new page without the bottom frame
            jasongreenberg Community Member

            Many thanks for your help guys, I am not a web developer or anything and I have a very limited knowledge of making web sites.  I am just trying to make my own site and this stuff is pretty much over my head.  I don't work with code and mainly work with the dreamweaver interface for all html programming.  I use CSS mainly for formatting, colours, fonts etc.  I have no idea how to apply this to a media player.  I checked out some tutuorials and it all seems a bit over my head. Can you recommend a simple way to accomplish something equivalent to a bottom frame where I could have an mp3 player remain at the bottom of my viewable window and even if it's a long page I can scroll around and the mp3 player will always remain in view at the bottom?  Hopefully there is a simple way to do this...

            Thanks!

            • 4. Re: Navigating from a web page with a bottom frame to a new page without the bottom frame
              sudarshan.t Community Member

              Can you recommend a simple way to accomplish something equivalent to a bottom frame where I could have an mp3 player remain at the bottom of my viewable window and even if it's a long page I can scroll around and the mp3 player will always remain in view at the bottom?  Hopefully there is a simple way to do this...

              Thanks!

               

              <div id="floatingfooter" style="position: fixed; bottom: 0px; right: 45%; opacity: 1;" title="Floating MP3 Player">

               

              Your MP3 player script can come here as is or within its own DIV

              </div>

               

              You could use this script on your HTML/ PHP page or you could define the style 'floatingfooter' within your main css file that you're calling.

               

              You could visit http://www.forwardfocus.in/v2-uc to see this in action. You'll see an image at the bottom 'Stay tuned to our updates'. Try resizing your window - you'll notice this sticks to the bottom. Similarly it'll stick to the bottom of your page when you have more content and a scrollbar too. This was the 'Coming Soon' landing page for my company's website that was made about 4 months ago.

               

              In some instances, you may have to add another CSS attribute 'z-index' if you have multiple DIVs and lots of content - z-index will decide the overlay of the div. Higher z-index will make the div display on top of all other divs and lower does vice-versa.

               


               

              Message was edited by: Sudarshan Thiagarajan - to add example

              • 5. Re: Navigating from a web page with a bottom frame to a new page without the bottom frame
                Ben Pleysier MVP

                Copy and paste the following into a new document and view in your favourite browser,

                 

                <!doctype html>
                <html>
                <head>
                <meta charset="utf-8">
                <title>Untitled Document</title>
                <style>
                * {
                    margin: 0;
                    padding: 0;
                }
                html {
                    background: #CCC;
                    height: 100%;
                }
                body {
                    width: 980px;
                    margin: auto;
                    background: #FFF;
                    height: 100%
                }
                
                p {
                    margin: 0.8em 0;
                }
                .header {
                    height: 150px;
                    background: #060;
                    padding: 20px;
                }
                .nav {
                    height: 35px;
                    background: #000;
                    color: #FFF;
                    line-height: 2em;
                    padding: 0 20px;
                }
                .article {
                    background: #FFF;
                    padding: 20px;
                }
                .footer {
                    height: 150px;
                    background: #060;
                    padding: 10px 20px;
                }
                </style>
                </head>
                
                <body>
                <div class="header"><h1>Header</h1></div>
                <div class="nav">Menu Bar</div>
                <div class="article">
                    <h2>This is the content area</h2>
                  <p>Quantitative analysis of all the key ratios has a vital role to play in this exploiting the productive lifecycle presentation of the process flow should culminate in idea generation. The strategic vision - if indeed there be one - is required to identify to focus on improvement, not cost, an important ingredient of business process reengineering. While those at the coal face don't have sufficient view of the overall goals. Exploiting the productive lifecycle taking full cognizance of organizational learning parameters and principles, in a collaborative, forward-thinking venture brought together through the merging of like minds. The three cs - customers, competition and change - have created a new world for business the components and priorities for the change program quantitative analysis of all the key ratios has a vital role to play in this.</p>
                  <p>The balanced scorecard, like the executive dashboard, is an essential tool working through a top-down, bottom-up approach, by moving executive focus from lag financial indicators to more actionable lead indicators. The three cs - customers, competition and change - have created a new world for business the vitality of conceptual synergies is of supreme importance that will indubitably lay the firm foundations for any leading company. In order to build a shared view of what can be improved, quantitative analysis of all the key ratios has a vital role to play in this an investment program where cash flows exactly match shareholders' preferred time patterns of consumption. To experience a profound paradigm shift, to ensure that non-operating cash outflows are assessed.</p>
                </div>
                <div class="footer"><p>Footer</p></div>
                </body>
                </html>
                

                 

                Gramps