1

I'm struggling to get this to work and have tried several solutions offered by different questions like: Display live width and height values on changing window resize

php echo statement if screen is a certain size

+more but no point linking, you get the point.

I'm not sure why I am not able to get it to work as intended...

Here is what I am trying to accomplish. On this page: http://www.websitebuilderexpert.com/website-builders-comparison-chart/ If you are looking at it in google chrome and resize your browser window as if your looking at it on a mobile phone a message appears. That's what I'm trying to accomplish. Is that message appearing at a certain innerwidth.

On my page I do use jquery: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

I was trying some inline javascript like:

<script type="text/javascript">
if( window.innerWidth < window.innerHeight) {
    echo 'Try the mobile version: <a href="example.com">click here</a>';
}
</script>

This seems like the preferred method

also tried:

<script type="text/javascript">
if( $(window).width() < 600 )
{
echo 'print something';
}
</script>

I'm definitely a noob when it comes to javascript so I don't really know what I'm doing other than trying a whole bunch of suggestions I have found here.

Can anyone point me in the right direction or provide some guidance? I would very much appreciate it! Thank you for your time and consideration.

Community
  • 1
  • 1
user5732656
  • 13
  • 3

1 Answers1

1

Your solution is basically correct, but you're using echo. echo is a PHP language construct. There's no such thing in JavaScript. You most likely meant to use alert(), as in alert('Try the mobile version: <a href="example.com">click here</a>');?

This will do what you want:

<script type="text/javascript">
if( window.innerWidth < window.innerHeight) {
    alert('Try the mobile version: <a href="example.com">click here</a>');
}
</script>

Here's a working jsFiddle.

Note: you could have caught this by looking at your browser's JavaScript console, where you would have seen an error (something like "Uncaught SyntaxError: Unexpected string").

Community
  • 1
  • 1
elixenide
  • 44,308
  • 16
  • 74
  • 100
  • Hi Ed, Thank you I guess I was just mindlessly putting echo in there because I am a little familiar with php I just tried it on this page: (http://thegamerstop.com/gamelist-a-z.php ) but it's still not working. I viewed source and it is exactly as you have written but not working =/ is there something else on the page keeping it from working or printing? – user5732656 Dec 14 '16 at 18:51
  • @user5732656 What do you see in your console when you load that page? – elixenide Dec 14 '16 at 19:16
  • Hi @Ed, thanks for getting back to me. Ok I was able to see the alert but only on load when refreshing the page when window.innerWidth < window.innerHeight but that's not really what I had intended. The effect I'm trying to achieve is actually having the message appear in the content on the page like it does on that site mentioned above websitebuilderexpert is there an echo equivalent in javascript that will allow the content inside to display inside the content of the page where the code is placed? – user5732656 Dec 14 '16 at 20:07
  • @user5732656 Yes, if you just put it in a `script` tag like that, without wrapping it in an event handler, it will only run on load/refresh. It won't run if, for example, you resize the window. To display the content somewhere in the page, you can just show or hide an element. For a simple example, see [this jsFiddle](https://jsfiddle.net/g9aqhta1/). If this helped you, please remember to accept the answer. :) You can always ask additional questions as new questions. – elixenide Dec 14 '16 at 20:22
  • ok will do on any additional questions. Thank you going to take a look at that fiddle and also accepted the answer provided with much gratitude. – user5732656 Dec 14 '16 at 20:25
  • @user5732656 Glad to help! – elixenide Dec 14 '16 at 20:27