Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Why dosent the picture show up on my mobile phone (iphone 5) or on my ipad ?

Posted on 2013-06-17
5
Medium Priority
?
181 Views
Last Modified: 2013-07-25
Hi!

Have this webpage:

<?php
error_reporting(E_ALL);
require_once('RAY_EE_config.php');
$table1 = 'Spm_Lokasjon';
// ACCESS TO THIS PAGE IS TESTED BUT NOT CONTROLLED
if ($uid = access_control(TRUE))
{
   $brukerID = brukerident('xxx');
   $navn = '';
   $navn = $_GET['Navn'];
   $lokk = $_GET['lokk'];
   $svar = $_GET['Svar'];   
   $teksten = $_GET['Teksten'];
   $kundeid = kundeid();
   
   if ($svar=='reg')   
   {
      $test=oppdaterlokasjonen($lokk,$kundeid);
   }
    if ($svar=='Videre')   
   {
	   $stat_trans = transaksjoner('TEST123',10,'DETTE ER EN TEST',$lokk,'Nei',$teksten,'','2013-05-05',$kundeid,$brukerID);
	   $sjekkomfleresp = sjekk_om_flere_sposmal($lokasjon,$kundeid);
	   if ($sjekkomfleresp=='0')
	   {
	      $sjekkst = oppdaterkontroller_status($lokk,$kundeid,$brukerID,0);
	      $lokk = hent_neste_kontroller($kundeid,$brukerID);
		  if ($lokk==0)
		  {
		    $oppdst=oppdaterkontroller_status($lokk,$kundeid,$brukerID,1); 
			oppdater_spmorsmal($lokk,$kundeid,1);
		    header("location: http://www.softkey.no/webtest/hovedside.php");
	      }
		  else
		  {
		     header("location: http://www.softkey.no/webtest/hovedside.php");
		  }
		  exit;
	   }
   }   
}
else
{
        header("location: login.php");
	    exit;
}
?>
<!DOCTYPE html>

<html>
<head>
<meta charset="utf-8" />
<title>Test system</title>

</head>

<body>
<link rel="stylesheet" href="default.css">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<br>
<table summary="Services, or Links box template" class="servicesT" cellspacing="1" border="0">
<tr><td colspan="2" class="servHd" height="40"><?php echo $navn;?></td></tr>
<br>

<tr>
<td class="servBodL" width="100%">
	<textarea id="tekstsvar" name="Teksten" width="100%" rows="10" style="background-image: url(images/penn.png"></textarea>
</td>
</tr>
<br>
<tr>
<td class="servBodL" width="100%">
<input id="file-input" type="file" name="image" accept="image/*" capture="camera" />
</td>
</tr>
<br><br>
</table>
<br><br><br><br>
<table width="100%">
<tr>

<fieldset id="actions" width="100%">

<td width="50%"><a href="http://www.softkey.no/webtest/neisvar.php?lokk=<?php echo $lokk; ?>&Kunde=<?php echo $kundeid; ?>&Navn=<?php echo $navn; ?>&Svar=Videre"><input type="submit" id="JAKNAPP" value="Videre"></a></td>
<td width="50%"><a href="http://www.softkey.no/webtest/hovedside.php"><input type="submit" id="NEIKNAPP" value="Avslutt"></a></td>
</fieldset>
</tr>
</table>
</body>
</html>

Open in new window



******************CSS**********************

html, body
{
    height: 100%;
}

body
{
    font: 12px 'Lucida Sans Unicode', 'Trebuchet MS', Arial, Helvetica;    
    margin: 0;
    background-color: #614912; 
	width:100%;
}

/*--------------------*/
a:link    {
  /* Applies to all unvisited links */
  text-decoration:  none;
  } 
#login
{
    background-color: #614912;
    border: none ! important;
    box-shadow: none ! important;
    outline: none ! important;
    position: absolute;
	width: 100%;
    top: 50%;
    left: 50%;
    z-index: 0;
    -webkit-border-radius:0px;
	webkit-appearance: none;
	border-radius:0px;
	-moz-border-radius:0px;
	-moz-box-shadow:0px;
	-webkit-box-shadow:0px;
	box-shadow:0px;
	-webkit-appearance: none;
}

#GULKN
{
    background-color: #e4ab15;
	font: 30px Arial, Helvetica;
    border: none ! important;
    box-shadow: none ! important;
    outline: none ! important;
    max-width: 50px;
	color: #ffffff;
	cursor: pointer;
	position: left;
	-webkit-border-radius:0px;
	border-radius:0px;
	-moz-border-radius:0px;
	-moz-box-shadow:0px;
	-webkit-box-shadow:0px;
	box-shadow:0px;
	-webkit-appearance: none;
}

/*--------------------*/

h1
{
    text-shadow: 0 1px 0 rgba(255, 255, 255, .7), 0px 2px 0 rgba(0, 0, 0, .5);
    text-transform: uppercase;
    text-align: center;
    color: #666;
    margin: 0 0 30px 0;
    letter-spacing: 4px;
    font: normal 26px/1 Verdana, Helvetica;
    position: relative;
}

h1:after, h1:before
{
    background-color: #777;
    content: "";
    height: 1px;
    position: absolute;
    top: 15px;
    width: 120px;   
}

h1:after
{ 
    background-image: -webkit-gradient(linear, left top, right top, from(#777), to(#fff));
    background-image: -webkit-linear-gradient(left, #777, #fff);
    background-image: -moz-linear-gradient(left, #777, #fff);
    background-image: -ms-linear-gradient(left, #777, #fff);
    background-image: -o-linear-gradient(left, #777, #fff);
    background-image: linear-gradient(left, #777, #fff);      
    right: 0;
}

h1:before
{
    background-image: -webkit-gradient(linear, right top, left top, from(#777), to(#fff));
    background-image: -webkit-linear-gradient(right, #777, #fff);
    background-image: -moz-linear-gradient(right, #777, #fff);
    background-image: -ms-linear-gradient(right, #777, #fff);
    background-image: -o-linear-gradient(right, #777, #fff);
    background-image: linear-gradient(right, #777, #fff);
    left: 0;
}

h1:after2
{ 
    background: #614912;    
    right: 0;
}

h1:before2
{
    background: #614912;
    left: 0;
}

/*--------------------*/

fieldset
{
    border: 0;
    padding: 0;
    margin: 0;
}

/*--------------------*/

#inputs input
{
    padding-right: 5px;
    margin: 0 0 10px 0;
	font: 20px Arial;
	height: 45px;
	color:#ffffff; 
	background-color: #96825a;
	border: none ! important;
    box-shadow: none ! important;
    outline: none ! important;
	width: 100%;
}

#uid
{
	height:20px;
	padding:10px 25px;
}

#pwd
{
    height:20px;
	 padding:10px 25px;
}
#username
{
background-repeat:no-repeat;
background-position:right; 
text-align:center;
background-origin:content-box;
}

#tekstsvar
{
background-repeat:no-repeat;
background-position:right; 
background-color: #d1c5b0;
text-align:center;
font: 20px Arial;
width:100%;
background-origin:content-box;
}

#password
{
background-repeat:no-repeat;
background-position:right; 
text-align:center;
background-origin:content-box;
}
#inputs input:focus
{
    background-color: #96825a;
    outline: none;
	width: 100%;
}

/*--------------------*/

#LOGIN
{		
    background-color: #e4ab15;
    float: center;
    height: 70px;
    width: 100%;
    cursor: pointer;
    font: 30px Arial, Helvetica;
	text-align:center;
    color: #ffffff;
    border: none ! important;
    box-shadow: none ! important;
    outline: none ! important;
    -webkit-border-radius:0px;
	border-radius:0px;
	-moz-border-radius:0px;
	-moz-box-shadow:0px;
	-webkit-box-shadow:0px;
	box-shadow:0px;
	-webkit-border-bottom-left-radius:0px;
	-webkit-appearance: none;
}

#JAKNAPP
{		
    background-color: #e4ab15;
    float: center;
    height: 55px;
    width: 100%;
    cursor: pointer;
    font: 30px Arial, Helvetica;
	text-align:center;
    color: #ffffff;
    border: none ! important;
    box-shadow: none ! important;
    outline: none ! important;
	-webkit-border-radius:0px;
	border-radius:0px;
	-moz-border-radius:0px;
	-moz-box-shadow:0px;
	-webkit-box-shadow:0px;
	box-shadow:0px;
	-webkit-appearance: none;
}

#NEIKNAPP
{		
    background-color: #880051;
    float: center;
    height: 55px;
    width: 100%;
    cursor: pointer;
    font: 30px Arial, Helvetica;
	text-align:center;
    color: #ffffff;
    border: none ! important;
    box-shadow: none ! important;
    outline: none ! important;
	-webkit-border-radius:0px;
	border-radius:0px;
	-moz-border-radius:0px;
	-moz-box-shadow:0px;
	-webkit-box-shadow:0px;
	box-shadow:0px;
	-webkit-appearance: none;
}

#LOGGUT
{		
    background-color: #d1c5b0;
    float: center;
    height: 55px;
    padding: 10px;
    width: 100%;
    cursor: pointer;
    font: 30px Arial, Helvetica;
	text-align:center;
    color: #ffffff;
	border-radius:10px;
    border: none ! important;
    box-shadow: none ! important;
    outline: none ! important;
	-webkit-border-radius:0px;
	border-radius:0px;
	-moz-border-radius:0px;
	-moz-box-shadow:0px;
	-webkit-box-shadow:0px;
	box-shadow:0px;
	-webkit-appearance: none;
}

#submit2
{		
    background-color: #96825a;
    float: center;
    height: 40px;
    width: 100%;
	margin:0;
    cursor: pointer;
    font: 20px Arial, Helvetica;
	text-align:center;
    color: #ffffff;
    border: none ! important;
    box-shadow: none ! important;
    outline: none ! important;
    -webkit-border-radius:0px;
	border-radius:0px;
	-moz-border-radius:0px;
	-moz-box-shadow:0px;
	-webkit-box-shadow:0px;
	box-shadow:0px;
	-webkit-border-bottom-left-radius:0px;
	-webkit-appearance: none;
}

table.hoved
{
    background-color: #614912;
    border: none ! important;
    box-shadow: none ! important;
    outline: none ! important;
    margin: -150px 0 0 -230px;
    padding: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 0;
	width: 100%;
}
table.servicesT
{ font-family: Verdana;
font-weight: normal;
font-size: 20px;
color: #404040;
background-color: #fafafa;
border: 0px #614912 solid;
border-collapse: collapse;
border-spacing: 0px;
margin-top: 0px;
width: 100%;
}


table.servicesT td.servHd
{ border-bottom: 1px solid #614912;
background-color: #96825a;
text-align: center;
font-family: Verdana;
font-size: 20px;
text-align: center;
color: #ffffff;
width: 100%;
}

table.servicesT td.header1
{ 
border-bottom: 1px solid #614912;
background-color: #614912;
font-family: Verdana;
font-size: 20px;
text-align: left;
color: #614912;
hight: 50px;
width: 100%;
}




table.servicesT td
{ border-bottom: 0px solid #614912;
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 20px;
text-align: center;
color: #404040;
background-color: #d1c5b0;
text-align: center;
padding-left: 3px;
width: 100%;
}

able.servicesJN td
{ 
font-family: Verdana, sans-serif, Arial;
font-weight: normal;
font-size: 20px;
text-align: center;
color: #404040;
background-color: #ffffff;
text-align: center;
padding-left: 3px;
width: 100%;
}

table.TESTE td
{
  color: #ffffff;
}
.servBodL 
{ 
background-color: #d1c5b0;
border-left: 0px solid #614912; 
} 
.servBodL_medborder
{ 
background-color: #d1c5b0;
border-left: 0px solid #614912; 
border-bottom: 1px solid #ffffff;
} 

Open in new window



My problem is that this code:
<td class="servBodL" width="100%">
	<textarea id="tekstsvar" name="Teksten" width="100%" rows="10" style="background-image: url(images/penn.png"></textarea>
</td>

The picture is not shown on my mobile phone or ipad. But are shown on my PC using firefox.

What do i do to autosize this <textare , so the picture will be shown on my mobile or ipad ?

Open in new window

0
Comment
Question by:team2005
  • 3
  • 2
5 Comments
 
LVL 13

Expert Comment

by:Gabriel Clifton
ID: 39254289
It doesn't look like TextArea honors the backgroundImage property. A workaround is to create a view with a background image and then add the TextArea to the view:
var textAreaWrap = Ti.UI.createView({
    backgroundImage:'/path/to/image.png'
});
var myTextArea = Ti.UI.createTextArea({
    background:'transparent'
});
textAreaWrap.add(myTextArea);
You'll have to finesse the dimensions of the TextArea so it fits inside the view, and potentially turn off any default styles on the TextArea.
0
 
LVL 2

Author Comment

by:team2005
ID: 39254334
Hi!

Can you please show me how to use the view inside my code ?
0
 
LVL 13

Accepted Solution

by:
Gabriel Clifton earned 1500 total points
ID: 39254401
var textAreaWrap = Ti.UI.createView({
    backgroundImage:'/images/penn.png'
});
var myTextArea = Ti.UI.createTextArea({
    background:'transparent'
});
textAreaWrap.add(myTextArea);
0
 
LVL 2

Author Comment

by:team2005
ID: 39254447
Hi!

Where do i put that code ?
0
 
LVL 2

Author Closing Comment

by:team2005
ID: 39354259
thanks
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

916 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question