Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Markup (HTML, XHTML, XML) _ html and frameset

Posted by: EveMene Nov 17 2017, 08:07 AM

Hi,

I'm a real noob here biggrin.gif
So my question can seem a little too easy/obvious wink.gif

I have this:

CODE

<html>
    <frameset rows='170,*'>
    <frame name=nav src = nav.php4>
    <frame name=affiche src=retro.php4>
    </frameset>
</html>


And I would like to have something like this:
CODE

<html>
    <script>
        var browserName = ' ' + navigator.userAgent.toLowerCase();
        if (browserName.indexOf("chrome") >= 0) {
            <frameset rows='190,*'>;
        }
        else {
            <frameset rows='170,*'>;
        }
    </script>
    <frame name=nav src = nav.php4>
    <frame name=affiche src=retro.php4>
    </frameset>
</html>


But like you can image, this is not working.

Can someone help me to resolve my problem? wub.gif

Posted by: Christian J Nov 17 2017, 11:38 AM

Hi

Framesets are a very outdated and unpractical technology (see http://htmlhelp.com/faq/html/all.html#frame-problems ). It's better to avoid them altogether, which is relatively easy with PHP (for including common content, such as the nav section) and CSS (to make it stay fixed at the top). Perhaps something like this:

CODE
<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width">
<title>Test</title>
<style type="text/css" media="screen">
body {padding-top: 190px;}

#nav {
margin: 0;
height: 190px;
position: fixed;
top: 0;
left: 0;
right: 0;
background: pink;
}
</style>
</head>
<body>

<div id="nav">
<?php include nav.php4; ?>
</div>

<h1>affiche</h1>

</body>
</html>


Browser sniffing is another technique that can be very fragile, especially if you rely on the browser's User Agent string like in this javascript. I don't know why you want the top frame height to be different in Chrome, maybe it can be avoided without resorting to javascript, but it's impossible to say from the code example.

Posted by: EveMene Nov 17 2017, 12:19 PM

QUOTE(Christian J @ Nov 17 2017, 11:38 AM) *

Hi

Framesets are a very outdated and unpractical technology (see http://htmlhelp.com/faq/html/all.html#frame-problems ). It's better to avoid them altogether, which is relatively easy with PHP (for including common content, such as the nav section) and CSS (to make it stay fixed at the top). Perhaps something like this:


Browser sniffing is another technique that can be very fragile, especially if you rely on the browser's User Agent string like in this javascript. I don't know why you want the top frame height to be different in Chrome, maybe it can be avoided without resorting to javascript, but it's impossible to say from the code example.


I know that it's outdated but I can't use anything else because it already there and I can't modify a lot of things ;(
This is not a code example, this is the real code!!!
I need the frame to be bigger with chrome because without these 20px I can't see the buttons on the bottom of the top frame.
This is to avoid to move the frame when opening in chrome.

Posted by: Christian J Nov 17 2017, 12:38 PM

QUOTE(EveMene @ Nov 17 2017, 06:19 PM) *

I can't use anything else because it already there and I can't modify a lot of things ;(

Why not? It's really not a good solution. If you're using a template or some kind of web service, consider changing it to something better.

QUOTE
I need the frame to be bigger with chrome because without these 20px I can't see the buttons on the bottom of the top frame.
This is to avoid to move the frame when opening in chrome.

Maybe the framed page nav.php4 is taller in Chrome for some reason, but without seeing the content of nav.php4 I can't say.




Posted by: Christian J Nov 18 2017, 06:01 AM

Here's a script that in theory (I haven't tested) should change the frameset row height, if the browser's UA string contains the word "chrome":

CODE
<script>
function rows_height()
{
    var browserName = navigator.userAgent.toLowerCase();
    if (browserName.indexOf("chrome") !=-1)
    {
        document.getElementsByTagName('frameset')[0].setAttribute('rows', '190,*');
    }
}
window.addEventListener('DOMContentLoaded', rows_height, false);
</script>

<frameset rows='170,*'>
<frame name=nav src = nav.php4>
<frame name=affiche src=retro.php4>
</frameset>

In other cases (or if javascript is disabled) the ROWS height defaults to the "170,*" set in the HTML.

Note that browsers are historically known to obfuscate their UA strings, so it's quite possible that non-Chrome browsers include the word "chrome" as well, now or in the future.

Posted by: pandy Nov 18 2017, 11:25 PM

I agree with Christian, this is the wrong way to go. And even if you do stick with frames, modifying a frame for a specific browser is wrong. Find out why the page acts differently in Chrome instead. We can help you, but as Christian said we need to see the whole thing to be able to.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)