| View previous topic :: View next topic |
| Author |
Message |
lantiqo
New member
Joined: 24 Jun 2012
Posts: 9
Location: Stockholm
|
 Posted: Mon Jun 25, 2012 12:01 pm Post subject: Apple iPhone 4s, images 3872x2592 |
 |
|
Wonder how many pixels an image can have in the Apple iPhone 4s. Tried my site today with images that are 3872x2592px.
I had put text over the pictures and saw that the text is presented from the top to the bottom of the images. On other phones and computers, the text is 20% from top to bottom of the picture.
Kind of like the pictures turned up-tight so they would fit on the screen. But the text size was of normal height.
I use this in the HTML code:
| Code: | <head>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
</head> |
|
|
| Back to top |
|
 |
sohnee
Senior Member
Joined: 17 Jul 2002
Posts: 2077
Location: UK
|
| Posted: Tue Jun 26, 2012 8:09 am Post subject: |
|
|
The iPhone has a 960-by-640 pixel retina display (321ppi).
Images larger than 960-by-640 may be scaled, thus changing the relative image-to-text-size ratio.
_________________
I also work on... Steve Fenton's Blog and contribute to The Enhance PHP Unit Testing Framework |
|
| Back to top |
|
|
lantiqo
New member
Joined: 24 Jun 2012
Posts: 9
Location: Stockholm
|
| Posted: Sun Jul 01, 2012 8:46 am Post subject: |
|
|
| sohnee wrote: | The iPhone has a 960-by-640 pixel retina display (321ppi).
Images larger than 960-by-640 may be scaled, thus changing the relative image-to-text-size ratio. |
Ok, is there any computer that is slightly bigger than the iPhone, which also scales images to a smaller size?
In my CSS I use:
| Code: | | @media screen and (max-width: 480px),(max-height: 480px) { |
to get my big pictures disappear in the iPhone |
|
| Back to top |
|
|
sohnee
Senior Member
Joined: 17 Jul 2002
Posts: 2077
Location: UK
|
|
| Back to top |
|
|
redfeilds18
New member
Joined: 25 Jul 2012
Posts: 1
|
| Posted: Wed Jul 25, 2012 11:01 am Post subject: |
|
|
| Code: | <html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;">
<meta name="apple-mobile-web-app-capable" content="yes" />
<style>
#fixed {
position: fixed;
width:200px;
height:200px;
z-index:1;
background: rgba(100,0,0,0.5);
}
#scrolling {
display: block;
position: absolute;
top: 100px;
left: 100px;
width:200px;
height:999px;
background: rgba(0,100,0,1);
}
</style>
</head>
<body>
<div id="fixed" ontouchend="alert('touch fixed')"></div>
<div id="scrolling" ontouchend="alert('touch scrolling')"></div>
</body>
|
Try using the above code change the width and height!
_________________
Website Development |
|
| Back to top |
|
|
energybell
New member
Joined: 19 Dec 2012
Posts: 2
Location: new york
|
| Posted: Wed Dec 19, 2012 2:59 am Post subject: |
|
|
| I´m going to use a 1px wide transparent picture @ max-width 480px, but I was not sure if there is a bigger iPhone wider then 480px and if that scale images. |
|
| Back to top |
|
|
stonjohn4
New member
Joined: 01 Jan 2013
Posts: 1
Location: pasban
|
| Posted: Tue Jan 01, 2013 11:36 pm Post subject: |
|
|
so when the user clicks on any product, all product information of the product should be displayed in a more prominent larger area at the top. the area should not be visible when it is not needed and have a border round it when it is seen
_________________
pass4sure1Y0-A20 pass4sure1Y0-A20
pass4sure642-617 pass4sure642-617 |
|
| Back to top |
|
|
shalamerylei
New member
Joined: 22 Jan 2013
Posts: 1
|
| Posted: Tue Jan 22, 2013 8:24 pm Post subject: |
|
|
| I also think that Images larger than 960-by-640 may be scaled, but for me, I use iPhone to computer app to do that. |
|
| Back to top |
|
|
|
TY JavaScript 3rd Ed.
FAQ
Search
Memberlist
Usergroups
Register
Profile
Log in to check your private messages
Log in
