INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Jobs

Conditional commands

Conditional commands

(OP)
Dear colleagues:

Inside <BODY> in my HTML code I have:
(in order to determine if the user browser is a Mobile one, return True.
If it is not a Mobile browser, then return False)

CODE -->

<script type="text/javascript">
function detectmob() { 
 if( navigator.userAgent.match(/Android/i)
 || navigator.userAgent.match(/webOS/i)
 || navigator.userAgent.match(/iPhone/i)
 || navigator.userAgent.match(/iPad/i)
 || navigator.userAgent.match(/iPod/i)
 || navigator.userAgent.match(/BlackBerry/i)
 || navigator.userAgent.match(/Windows Phone/i)
 ){
    return true;
  }
 else {
    return false;
  }
}
</script> 


Well, in the same HTML page I have: (in order to display a Flash animated banner)

CODE

<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0' width='720' height='100'><param name='movie' value='receitas1.swf'/><param name='wmode' value='#ffffff'/><param name='quality' value='high'/><embed src='receitas1.swf' quality='high' wmode='#ffffff'pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' width='720' height='100'></embed>
</object> 

I would like to execute the above code (the banner) if the function detectmob() returns False.
If it returns True, it is because the user browser is a Mobile one, so, instead of the animated banner in Flash I would like to display an static image:

CODE

<IMG SRC="receitas1_256.gif" WIDTH="80%"> 

How to accomplish this?
Is there a command in HTML or I will have to change the <object> command to Javascript?

Thank you,
SitesMasstec

RE: Conditional commands

There's a couple of ways of doing this.

Personally I would just get the element where you wish this to be, like a div or something, and alter its innerHTML property.

CODE

<body onload="loadBanner();">
...
<div id="banner">
<!-- You want to see the banner here --->
</div>

<script type="text/javascript">
function loadBanner()
{
var bannerDiv = document.getElementByID('banner');
if(detectmob()==true)
{
bannerDiv.innerHTML = '<IMG SRC="receitas1_256.gif" WIDTH="80%">';
}
else{
bannerDiv.innerHTML = "<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0' width='720' height='100'><param name='movie' value='receitas1.swf'/><param name='wmode' value='#ffffff'/><param name='quality' value='high'/><embed src='receitas1.swf' quality='high' wmode='#ffffff'pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' width='720' height='100'></embed> </object>"
}
} </script>

----------------------------------
Phil AKA Vacunita
----------------------------------
OS-ception: Running Linux on a Virtual Machine in Windows which itself is running in a Virtual Machine on Mac OSx.

Web & Tech

RE: Conditional commands

(OP)
Hello Phil!

I tried your advice but it hasn't working:

CODE -->

...

<BODY TEXT="#FFFF4A" BGCOLOR="#9BCDFF" link="#DD0000" vlink="#DD0000" alink="#008000" LEFTMARGIN="25" onload="loadBanner();" >


<FONT  FACE="Verdana" COLOR="#23238E">
<BR>

<!-- 22/10/2017, de: https://stackoverflow.com/questions/11381673/detecting-a-mobile-browser -->
<script type="text/javascript">
function detectmob() { 
 if( navigator.userAgent.match(/Android/i)
 || navigator.userAgent.match(/webOS/i)
 || navigator.userAgent.match(/iPhone/i)
 || navigator.userAgent.match(/iPad/i)
 || navigator.userAgent.match(/iPod/i)
 || navigator.userAgent.match(/BlackBerry/i)
 || navigator.userAgent.match(/Windows Phone/i)
 ){
    return true;
  }
 else {
    return false;
  }
}
</script>


<div id="banner">
<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0' width='720' height='100'><param name='movie' value='receitas1.swf'/><param name='wmode' value='#ffffff'/><param name='quality' value='high'/><embed src='receitas1.swf' quality='high' wmode='#ffffff'pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' width='720' height='100'></embed>
</object>
</div>

<script type="text/javascript">
function loadBanner()
{
var bannerDiv = document.getElementByID('banner');
if(detectmob()==true)
{

bannerDiv.innerHTML = '<IMG SRC="receitas1_256.gif" WIDTH="80%">'; 
}
else{
bannerDiv.innerHTML = "<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0' width='720' height='100'><param name='movie' value='receitas1.swf'/><param name='wmode' value='#ffffff'/><param name='quality' value='high'/><embed src='receitas1.swf' quality='high' wmode='#ffffff'pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' width='720' height='100'></embed>
</object>" 
}
}

</script> 

... 

You can see the result at:
www.masstec.com.br/receitas/receitasnew2.htm


But for accessing a mobile device I do not wish the flash banner. Instead I wish the image "receitas1_256.gif", that can de displayed on a mobile device) , so I changed part of it to:

CODE -->

<script type="text/javascript">
function loadBanner()
{
var bannerDiv = document.getElementByID('banner');
if(detectmob()==true)
{
bannerDiv.innerHTML = '<IMG SRC="receitas1_256.gif" WIDTH="80%">'; 
}
else{
bannerDiv.innerHTML = "<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0' width='720' height='100'><param name='movie' value='receitas1.swf'/><param name='wmode' value='#ffffff'/><param name='quality' value='high'/><embed src='receitas1.swf' quality='high' wmode='#ffffff'pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' width='720' height='100'></embed>
</object>" 
}
}

</script> 

You can see the result at:
www.masstec.com.br/receitas/receitasnew3.htm

Thank you,
SitesMasstec

RE: Conditional commands

This should work, had missed a semicolon, and the <object> closing tag was on a new line :

CODE

<BODY TEXT="#FFFF4A" BGCOLOR="#9BCDFF" link="#DD0000" vlink="#DD0000" alink="#008000" LEFTMARGIN="25" onload="loadBanner();" >


<FONT  FACE="Verdana" COLOR="#23238E">
<BR>

<!-- 22/10/2017, de: https://stackoverflow.com/questions/11381673/detecting-a-mobile-browser -->
<script type="text/javascript">
function detectmob() { 
 if( navigator.userAgent.match(/Android/i)
 || navigator.userAgent.match(/webOS/i)
 || navigator.userAgent.match(/iPhone/i)
 || navigator.userAgent.match(/iPad/i)
 || navigator.userAgent.match(/iPod/i)
 || navigator.userAgent.match(/BlackBerry/i)
 || navigator.userAgent.match(/Windows Phone/i)
 ){
    return true;
  }
 else {
    return false;
  }
}
</script>


<div id="banner">
<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0' width='720' height='100'><param name='movie' value='receitas1.swf'/><param name='wmode' value='#ffffff'/><param name='quality' value='high'/><embed src='receitas1.swf' quality='high' wmode='#ffffff'pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' width='720' height='100'></embed>
</object>
</div>

<script type="text/javascript">
function loadBanner()
{
var bannerDiv = document.getElementById('banner');
if(detectmob()==true)
{

bannerDiv.innerHTML = '<IMG SRC="receitas1_256.gif" WIDTH="80%">'; 
}
else{
bannerDiv.innerHTML = "<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0' width='720' height='100'><param name='movie' value='receitas1.swf'/><param name='wmode' value='#ffffff'/><param name='quality' value='high'/><embed src='receitas1.swf' quality='high' wmode='#ffffff'pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' width='720' height='100'></embed></object>"; 
}
} 

----------------------------------
Phil AKA Vacunita
----------------------------------
OS-ception: Running Linux on a Virtual Machine in Windows which itself is running in a Virtual Machine on Mac OSx.

Web & Tech

RE: Conditional commands

(OP)
Hello Phil!

Nice, it works as expected now, except I do not know how to align the flash banner in center of the web page.

Where in the code I can put ALIGN="CENTER" ?

CODE -->

...
else{
bannerDiv.innerHTML = "<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0' width='720' height='100'><param name='movie' value='receitas1.swf'/><param name='wmode' value='#ffffff'/><param name='quality' value='high'/><embed src='receitas1.swf' quality='high' wmode='#ffffff'pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' width='720' height='100'></embed></object>"; 
}
--- 


The non Flash banner appears correctly in mobile devices, as I was able to insert ALIGN on it:

CODE -->

bannerDiv.innerHTML = '<H3 ALIGN="CENTER"><IMG SRC="receitas1_256.gif" WIDTH="80%"></H3>'; 

Thank you,
SitesMasstec

Red Flag This Post

Please let us know here why this post is inappropriate. Reasons such as off-topic, duplicates, flames, illegal, vulgar, or students posting their homework.

Red Flag Submitted

Thank you for helping keep Tek-Tips Forums free from inappropriate posts.
The Tek-Tips staff will check this out and take appropriate action.

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members!

Resources

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close