jimpyle48 Posted March 12, 2016 Share Posted March 12, 2016 I wrote a player aid for a board game using html and javascript. Works fine on Window based machines and MacBook but not on iPad. Is there an easy fix or a site to let me know how to get it to work on iPads? Thanks! Jim Link to comment Share on other sites More sharing options...
davej Posted March 12, 2016 Share Posted March 12, 2016 What doesn't work? Link to comment Share on other sites More sharing options...
jimpyle48 Posted March 14, 2016 Author Share Posted March 14, 2016 I have some buttons in the window and they appear fine with MacBook and Windows but they only appear about 10% of the proper height on an iPad so you can't read the text in the buttons. Link to comment Share on other sites More sharing options...
davej Posted March 14, 2016 Share Posted March 14, 2016 How did you size/style the buttons? Link to comment Share on other sites More sharing options...
Ingolme Posted March 14, 2016 Share Posted March 14, 2016 I think this is due to iPad using the operating system's default button style. You can force the button to not do that using -webkit-appearance: none on its CSS. Link to comment Share on other sites More sharing options...
jimpyle48 Posted March 22, 2016 Author Share Posted March 22, 2016 I tried the -webkit -appearance from above but it didn't work. I may well have not entered it correctly. Here's a sample of the html code: <div id="button_win"> <button onclick="throwdice(), upTime(), cardRoll()"><img src="Graphics/CardButton.png"></button> <button onclick="playerCont()"><img src="Graphics/PlayerControl.png"></button> <button onclick="throwdice(), playerIdent()"><img src="Graphics/PlayerIdent.png"></button> <button onclick="throwdice(), cornerIdent()"><img src="Graphics/PlayerIdentCorner.png"></button> </br> And in the css I have: div#button_win{ background-image:url("Graphics/Table-Window-300.png"); background-repeat:no-repeat; background-size:100% 100%; width: 50%; float: left; -webkit-appearance: none;} Any suggestions? Thanks in advance. Jim Link to comment Share on other sites More sharing options...
Ingolme Posted March 23, 2016 Share Posted March 23, 2016 This: div#button_win button { -webkit-appearance: none;} But those buttons seem redundant, just put the onclick handlers on the <img> tags themselves and remove the buttons. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now