6 {{ upvoteCount | shortNum }}
6 {{ upvoteCount | shortNum }}

Simple Javascript question. I hope...?

by WillR
5 replies
Warriors,

I'm using a simple script to detect the screen size of a visitors browser. That script will then send users with a screen width less than 800 pixels to a website of my choice. Here is the simple script:

HTML Code:
<script type="text/javascript">
<!--
if (screen.width <= 800) {
document.location = "http://www.google.com";
}
//-->
</script>
What I want to do is instead of redirecting a user to another website, I want to display a message to users with a screen width less than 800. I don't want this to be a popup, I just want to display it at the very top of the page.

Is there anyway to do this?

I have tried using this code and it works at putting a message at the top of the page:

HTML Code:
<script type="text/javascript">
<!--
if (screen.width <= 800) {
document.writeln('hello world!');
}
//-->
</script>
How can I style that hello word text thought?

Thanks!
#hope #javascript #question #simple
  • Profile picture of the author affiliatepro15
    One option is that you can include a element and style information in your writeln:

    document.writeln('<span class="your class name">hello world!</span>');
    document.writeln('<span style="your css info">hello world!</span>');


    Instead of using document.writeln, you can simply fill a existing element on the page...

    On the page, add your css info in the head and add a element where you want the hello, world to appear. <div id="message-holder" style="display:none;"></div>

    then in your script:
    var elm=document.getElementById('message-holder');
    elm.innerHTML = "Hello, world!";
    elm.style.color="red"; //u can use any valid css here...


    BTW, Unless you plan to become a JavaScript expert, I would recommend using a jQuery which will normalize your commands across different browsers and make things much easier to program... this way you won't have to worry about your scripts working in some browsers but not others.
    {{ DiscussionBoard.errors[3788590].message }}
    • Profile picture of the author wayfarer
      Originally Posted by affiliatepro15 View Post

      BTW, Unless you plan to become a JavaScript expert, I would recommend using a jQuery which will normalize your commands across different browsers and make things much easier to program... this way you won't have to worry about your scripts working in some browsers but not others.
      jQuery is great, and I highly recommend it. However, for something so simple, it is not needed.
      Signature
      I build web things, server things. I help build the startup Veenome. | Remote Programming Jobs
      {{ DiscussionBoard.errors[3789191].message }}
  • Profile picture of the author majick
    seems like overkill to me, just put the html tags inside the write statement?
    document.writeln('<font color="red">hello world!</font>');
    {{ DiscussionBoard.errors[3904477].message }}
  • Profile picture of the author Web Tempest
    I'd just use jquery - you don't even have to download it - just call it from googleapis
    Signature
    Blueprint Mint - The Internet Marketing Marketplace
    {{ DiscussionBoard.errors[4073124].message }}
  • Profile picture of the author tks
    If you haven't got one so far, try this out...

    <html>
    <head>
    <script type="text/javascript">
    window.onload=function (){
    document.onmousemove=function(evt){
    evt?evt:evt=event
    document.getElementById("xsize").innerHTML=evt.cli entX+"px"
    document.getElementById("ysize").innerHTML=evt.cli entY+"px"}
    }
    </script>
    </head>

    <body>
    <div id="xsize"></div>
    <div id="ysize"></div>
    </body>
    </html>
    Signature
    Cloud Computing
    Android Project Ideas
    {{ DiscussionBoard.errors[4074379].message }}

Trending Topics