Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Apr 2010
    Location
    canada
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    i need help Detecting screen resolution

    Hi im trying to implement this javascript code

    Code:
    /*
     * 
     * Part of article How to detect screen size and apply a CSS style
     * http://www.ilovecolors.com.ar/detect-screen-size-css-style/
     *
     */
    $(document).ready(function() {
    
    if ((screen.width>=1400) && (screen.height>=1050)) {
    $("link[rel=stylesheet]:not(:first)").attr({href : "style.css"});
    }
    else  {
    $("link[rel=stylesheet]:not(:first)").attr({href : "style1.css"});
    }
    });
    into my header.php file so that it will detect the users resolution and open a custom stylesheet for each. I had no problem getting it to work in an html document when used like this

    Code:
    <head>
    <link rel="stylesheet" type="text/css" href="reset.css"/>
    <link rel="stylesheet" type="text/css" href="detect800.css"/>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="detect.js"></script>
    but if i try and call the same script from my header.php it doesnt work
    heres the original header.php

    Code:
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <link rel="stylesheet" type="text/css" href="reset.css"/>
    <link rel="stylesheet" type="text/css" href="detect800.css"/>
    <style type="text/css" media="screen">@import "<?php echo $this->getStyleSheet('style.css')?>";</style>
    <?php Loader::element('header_required'); ?>
    <?php
    $cp = new Permissions($c);
    if($cp->canWrite() && $cp->canAddSubContent()){
    	echo('<style type="text/css">body{background-position:0px 49px;}</style>');
    }?>
    </head>
    <body>
    <div id="wrapper">
    	<div id="logo">
    		<h1><a href="<?php  echo DIR_REL?>/"><?php echo SITE?> </a></h1>
    		<p><em><?php echo $c->getCollectionName() ?></em></p>
    	</div>
    	<hr />
    	<!-- end #logo -->
    	<div id="header">
    		<div id="menu">
    			<?php
    				$ah = new Area('Header Nav');
    				$ah->display($c);
    			?>
    		</div>
    		<!-- end #menu -->
    		
    	</div>
    	<!-- end #header -->
    	<!-- end #header-wrapper -->
    and i edited it to look like this with to no avail
    Code:
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <link rel="stylesheet" type="text/css" href="reset.css"/>
    <link rel="stylesheet" type="text/css" href="detect800.css"/>
    <script type="text/javascript" src="jquery.js"/>
    <script type="text/javascript" src="detect.js"/> 
    <?php Loader::element('header_required'); ?>
    <?php
    $cp = new Permissions($c);
    if($cp->canWrite() && $cp->canAddSubContent()){
    	echo('<style type="text/css">body{background-position:0px 49px;}</style>');
    }?>
    </head>
    <body>
    <div id="wrapper">
    	<div id="logo">
    		<h1><a href="<?php  echo DIR_REL?>/"><?php echo SITE?> </a></h1>
    		<p><em><?php echo $c->getCollectionName() ?></em></p>
    	</div>
    	<hr />
    	<!-- end #logo -->
    	<div id="header">
    		<div id="menu">
    			<?php
    				$ah = new Area('Header Nav');
    				$ah->display($c);
    			?>
    		</div>
    		<!-- end #menu -->
    		
    	</div>
    	<!-- end #header -->
    	<!-- end #header-wrapper -->

  • #2
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    You're putting yourself at a big disadvantage right off the bat by not using jQuery's .width() and .height() functions, which are cross-browser compatible.

    At any rate... if you view source code, does your html render as you expect?

  • #3
    New to the CF scene
    Join Date
    Apr 2010
    Location
    canada
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    yes everything looks fine html wise and thanks for the tip


  •  

    LinkBacks (?)


    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •