Discussion Forums  >  WebViews and HTML for Mobile

Replies: 13    Views: 119

RB
Aspiring developer
Profile
Posts: 150
Reg: Jun 29, 2011
BR
6,150
07/30/12 01:12 PM (13 years ago)

HTML image buttons

I created a html menu using images as buttons. Had previously tested the JS script and had functioned normally. When I applied the command button with the image, th buttons appears but it stopped working. Is there a specific procedure when using images as buttons? Thank you.
 
Fred@mySkylla com
Android Fan
Profile
Posts: 5259
Reg: Oct 03, 2011
location unknow...
62,560
like
07/30/12 01:20 PM (13 years ago)
When I applied the command button with the image Please explain. Fred
 
RB
Aspiring developer
Profile
Posts: 150
Reg: Jun 29, 2011
BR
6,150
like
07/30/12 01:31 PM (13 years ago)
In the html code. I call this page in HTML DOC. When I put this command in text link works very well.
 
Fred@mySkylla com
Android Fan
Profile
Posts: 5259
Reg: Oct 03, 2011
location unknow...
62,560
like
07/30/12 01:41 PM (13 years ago)
Post your html image/button link.
 
RB
Aspiring developer
Profile
Posts: 150
Reg: Jun 29, 2011
BR
6,150
like
07/30/12 02:33 PM (13 years ago)
Everything works fine on the PC. In this code I'm mapping the overall picture instead using a button <body> <p> src="img.jpg" <img width="360" height="480" border="0" /> usemap="#Map"    <MAP name="Map" id="Map">      <area shape="circle" coords="291,105,39" href="#" onClick="Randomlink (); return(false)"/>    </ map> </ p> </ body>
 
Fred@mySkylla com
Android Fan
Profile
Posts: 5259
Reg: Oct 03, 2011
location unknow...
62,560
like
07/30/12 03:33 PM (13 years ago)
Try: <a href="http://www.myskylla.com"><img title="Fred_Buzztouch.jpg" class="alignnone" alt="image" src="http://myskyllanotesmy.files.wordpress.com/2012/07/wpid-fred_buzztouch.jpg" /></a> Just replace the image and the href. Fred
 
RB
Aspiring developer
Profile
Posts: 150
Reg: Jun 29, 2011
BR
6,150
like
07/30/12 03:40 PM (13 years ago)
I had tested with a regular link, and it worked well. I need to use the script of randomization. Have checked the code and made ​​some changes and it seems that it worked. How can I do to fix the size of the html page in the screen (no scrolls), remembering that I will not use the option of background image of the screen? Thanks
 
Fred@mySkylla com
Android Fan
Profile
Posts: 5259
Reg: Oct 03, 2011
location unknow...
62,560
like
07/30/12 05:02 PM (13 years ago)
What's the spot to randomize? <meta name="viewport" content="width=device-width, initial-scale=1"> Fred
 
RB
Aspiring developer
Profile
Posts: 150
Reg: Jun 29, 2011
BR
6,150
like
07/30/12 05:39 PM (13 years ago)
I intend to randomize some pages to show different results <meta name="viewport" content="width=device-width, initial-scale=1"> ...for android? I put in the heade of my menu page but nothing change. This page has only one image that I mapped to define the clickable areas. I need to fit this image like happens with backgound image of the html doc, for example.
 
Fred@mySkylla com
Android Fan
Profile
Posts: 5259
Reg: Oct 03, 2011
location unknow...
62,560
like
07/30/12 05:55 PM (13 years ago)
What's the spot to randomize? Meant to say what's the script? Send me the HTML and I'll take a look. Fred
 
RB
Aspiring developer
Profile
Posts: 150
Reg: Jun 29, 2011
BR
6,150
like
07/30/12 06:06 PM (13 years ago)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=320"> <title>Untitled Document</title> <SCRIPT Language="Javascript"> <!-- function Randomlink() { Url = new Array; Url[0] = "1a.html"; Url[1] = "1b.html"; Url[2] = "1c.html"; Url[3] = "1d.html"; Chooselink = Math.round(Math.random() * (Url.length+1)); window.open(Url[Chooselink],'_blank'); } //--> </SCRIPT> <style type="text/css"> body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; background-image: url(); background-repeat: no-repeat; } </style> </head> <body> <p><img src="menu_pq.jpg" width="360" height="480" usemap="#Map" border="0" /> <map name="Map" id="Map"> <area shape="circle" coords="291,105,39" href="#" onClick="Randomlink (); return(false)"/> </map> </p> <embed src="song.mp3" hidden="true" loop="infinite" autostart="TRUE"> </body> </html>
 
Fred@mySkylla com
Android Fan
Profile
Posts: 5259
Reg: Oct 03, 2011
location unknow...
62,560
like
07/30/12 06:14 PM (13 years ago)
Must go, so until later. Try this in the head: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>MySkylla's Guide to Buzztouch </title> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" /> <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
 
RB
Aspiring developer
Profile
Posts: 150
Reg: Jun 29, 2011
BR
6,150
like
07/30/12 06:25 PM (13 years ago)
Fred, I stopped to use JQuerry for while. I need to create a demo and opted for JS. I need to fix page area (no scroll) and solve the audio's problem. Did you see the "embed"comand? Is it right? And about the metaname "viewport", why it's not working? Thanks
 
Fred@mySkylla com
Android Fan
Profile
Posts: 5259
Reg: Oct 03, 2011
location unknow...
62,560
like
07/30/12 09:31 PM (13 years ago)
For viewport try: <meta name="viewport" content="width=device-width, initial-scale=1"> Instead of width=360 Options: maximum-scale=1"> Or user-scalable = no"> Fred
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.