画面サイズに応じてデータベースとは別のイメージを取得

Question

私はWebアプリケーションを作成し始めています。URLに応じて、データベースから読み込まれたさまざまなテキストや画像からアクセスされます。 www.mitdomæne.dk/？id = 1 0.2 0.3など50個までです。

問題は、モバイルまたはパッド（画面サイズ）に応じて自分自身をオフに切り替えるための動的コンテンツが必要なことです。

私は、どのようなサイズの画面を選択し、正しい画像をエコーするPHPを得ることができますか？

サイドを見ているiPhoneの場合、320px幅の画像が読み込まれ、ipadの場合は1024pxの幅です。

これらのフィールドを使用してMySQLの日付ベースを作成しました。

ID： 会社： Billed_fil

とコードは次のようになります。

HTML：

<div data-role="page" id="side1"> 
    <div data-role="header" data-nobackbtn="true"> </ div> 
    <div data-role="content"> 
    <p class="brod"> <? php echo $ company?> </ p> 
<div id="billede"> <img src = "<? php echo $ billed_fil?>" alt = "" border = "0" /> </ div> 
    </ div> 
    <div data-role="footer"> </ div> 
</ div> 

PHP：

<? php 

include 'firmaer_db_cnx.inc.php'; 

$ id = $ _GET ['id']; 
    $ sql = mysql_query ("SELECT * FROM info_int WHERE id = '$ id'"); 

    $ company list = mysql_fetch_array ($ sql); 

    $ id = $ company list ['id']; 
    $ company = $ company list ['company']; 
    $ billed_fil = $ company list ['billed_fil']; 

?> 

SQLのバージョン5.1.53 PHPバージョン5.3.4

それは可能ですか？

//カスパー画面サイズを取得する

Answer 1

CSSを使用してこれを行うさらに簡単な方法があるかもしれません。このデモをご覧ください：

http://www.alistapart.com/d/responsive-web-design/ex/ex-site-larger.htmlヒント：ブラウザウィンドウのサイズを変更してください。

そして、これを行う方法を説明するArticleです。さらにいくつかはbackground infoです。

Answer 2

唯一可能な方法は、javascriptや一部のfimiliar fronendプログラミング言語を通じて、あなたは、AJAX呼び出しを使用することができますいずれかのクッキーに保存し、その後のuをPHPでそれを読んで、またはありますもう少しスマートにして、同じ名前の画像を1つのdiffrenceというエンディングで保存してください...解像度は です（例：iamge1024x123.png）。次に、解像度に応じてjavascript onloadを使用して適切な画像を追加します。データベースへの無意識な呼び出しを保存して、u'rでパフォーマンスを少し向上させます。

Answer 3

PHPは、クライアントブラウザに表示される前にサーバー上で実行されるため、クライアントブラウザが実行されている画面サイズについてはわかりません。あなたがこれを行う可能性のある1つの方法は、JavaScriptを使ってスクリーンサイズを取得し、それらの値をPHPに渡すことです（AJAX呼び出し経由）。もちろん、他のSO人は他のアイデア（おそらく私のものよりも優れている）を思いつくでしょう。あなたのやり方はあなたの選択です。

Answer 4

だけで、データベースの外部画像を保存するには、この

<script language="JavaScript" type="text/javascript"> 
if(screen.width==800 && screen.height==600){ 
document.images['id'].src='<? php echo $ billed_fil?>-800x600.gif'; 
} 
else if(screen.width==1024 && screen.height==768){ 
document.images['id'].src='<? php echo $ billed_fil?>-1024x768.gif'; 
} 
else{ 
document.images['id'].src='<? php echo $ billed_fil?>-default.gif'; 
} 
</script>