Results 1 to 5 of 5

Thread: [RESOLVED] PHP page doesn't work iPhone

  1. #1

    Thread Starter
    Fanatic Member
    Join Date
    Mar 2008
    Posts
    790

    Resolved [RESOLVED] PHP page doesn't work iPhone

    I created a basic website that uses php.

    My login form loads just fine on most browsers, and will load/work properly on my Android phone. When the browser loads the page on an iPhone, once the user clicks on the username or password field, the onscreen keyboard shows and there is a cursor in the textbox. However, the iPhone freezes immediately and locks up. Nothing can be done except close the browser!

    The form works just fine on my iPad and Android, as mentioned.

    Here's the css and form I am using:

    Code:
    <style type="text/css">
    	* {
    		margin: 0px;
    		padding: 0px;outline: none;
    	}
    
    	body {
    		background: #666;
    	}
    
    	form {
    		border: 1px solid #E2E2E2;
    		width: 250px;
    		-moz-border-radius: 20px;
    		-webkit-border-radius: 20px;
    		background:  -moz-linear-gradient(19% 75% 90deg, #999,  #E2E2E2);
    		background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#E2E2E2), to(#999));
    		margin:50px auto;
    		padding: 20px;
    		-moz-box-shadow:0px -5px 300px #270644;
    		-webkit-box-shadow:0px -5px 300px #270644;
    	}
    
    	label {
    		font-size: 12px;
    		font-family: arial, sans-serif;
    		list-style-type: none;
    		color: #000;
    		text-shadow: #CCC 1px 1px;
    		margin-bottom: 10px;
    		font-weight: bold;
    		letter-spacing: 1px;
    		text-transform: uppercase;
    		display: block;
    	}
    
    	input {
    	  -webkit-transition-property: -webkit-box-shadow, background;
    	  -webkit-transition-duration: 0.25s;
    	  	padding: 6px;
    		border-bottom: 0px;
    		border-left: 0px;
    		border-right: 0px;
    		border-top: 1px solid #999;
    		-moz-box-shadow: 0px 0px 2px #000;
    		-webkit-box-shadow: 0px 0px 2px #000;
    		margin-bottom: 10px;
    		background:  #E2E2E2;
    		width: 230px;
    	}
    
    	input.submit {
    	  -webkit-transition-property: -webkit-box-shadow, background;
    	  -webkit-transition-duration: 0.25s;
    		width: 100px;
    		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#33F), to(#36F));	
    		background:  -moz-linear-gradient(19% 75% 90deg,#36F, #33F);
    		color: #fff;
    		text-transform: uppercase;
    		text-shadow: #000 1px 1px;
    		border-top: 1px solid #33F;
    		margin-top: 10px;
    	}
    
    	input.submit:hover {
    		-webkit-box-shadow: 0px 0px 2px #000;
    		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#33F), to(#36F));
    		background:  -moz-linear-gradient(19% 75% 90deg, #36F, #33F);
    	} 
    
    	input.submit:active {
    		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#36F), to(#33F));
    		background:  -moz-linear-gradient(19% 75% 90deg,#33F, #36F);
    	}
    
    	input:hover {
    		-webkit-box-shadow: 0px 0px 4px #000;
    		background: #92A5FE;
    	}
    
    	</style>
    Code:
    <form id="form1" name="form1" method="POST" action="<?php echo $loginFormAction; ?>">
    <div id="logo">
    <a href="http://www.mytesturl.com"><img src="images/logo.png" width="250" height="70" alt="logo"/></a>
    </div>
    <br />
    <br />
          <label>Username:</label>
              <input type="text" name="username" id="username" />
    	  <label>Password:</label>
              <input type="password" name="password" id="password" />
         
    <table width="100%">
            <tr>
              <td align="center"><input type="submit" name="login" id="login" value="Login" class="submit"/></td>
    </tr>
          </table>
    </form>

    Can anyone shed a little light on the issue? Thank you!


    **** This thread was in Mobile Development. I put in a request to have it moved. Since it wasn't, I do apologize that I had to repost it. ****

  2. #2
    Freelancer akhileshbc's Avatar
    Join Date
    Jun 2008
    Location
    Trivandrum, Kerala, India
    Posts
    7,652

    Re: PHP page doesn't work iPhone

    It doesn't looks like anything with your PHP scripting !

    Either it's because of the CSS styles or because of the JavaScript code(if any).


    If my post was helpful to you, then express your gratitude using Rate this Post.
    And if your problem is SOLVED, then please Mark the Thread as RESOLVED (see it in action - video)
    My system: AMD FX 6100, Gigabyte Motherboard, 8 GB Crossair Vengance, Cooler Master 450W Thunder PSU, 1.4 TB HDD, 18.5" TFT(Wide), Antec V1 Cabinet

    Social Group: VBForums - Developers from India


    Skills: PHP, MySQL, jQuery, VB.Net, Photoshop, CodeIgniter, Bootstrap,...

  3. #3

    Thread Starter
    Fanatic Member
    Join Date
    Mar 2008
    Posts
    790

    Re: PHP page doesn't work iPhone

    Thanks. It's bugging me. I don't have any JS, so it has to be the CSS. I wonder what's going on...

  4. #4
    Frenzied Member
    Join Date
    Apr 2009
    Location
    CA, USA
    Posts
    1,516

    Re: PHP page doesn't work iPhone

    What model of iPhone? Seems like the older ones can get bogged down by -webkit properties. I'd try getting rid of the transitions first and see if it improves; if not, then start nixing the other vendor-specific properties.

  5. #5

    Thread Starter
    Fanatic Member
    Join Date
    Mar 2008
    Posts
    790

    Re: PHP page doesn't work iPhone

    It was the -webkit properties. I restyled my form, and it works ok now.

    The issue was on a 1st generation iPhone.

    That's a great link, SambaNeko. Thank you!

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  



Click Here to Expand Forum to Full Width