画面サイズ検出後のcoldfusion

Question

私は応答性の高いWebサイトを作っています。画面サイズを取得するためにjavascriptを使用し、画面サイズに応じてcoldfusionインクルードをレンダリングすることができます。このような何か：

if (screen.width <= 700) { 
    <cfinclude template="file1.cfm"> 
} else { 
    <cfinclude template="file.cfm"> 
} 

私も（アヤックスを経由してロードしようとしました）が、私はすでに含めるにCFMファイル内のファイルが含まれていたとき、私は動けなくなります。

Answer 1

あなたがしようとしていることはできません。 JavaScriptはクライアント側の言語ですが、ColdFusionはサーバー側の言語です。 JavaScriptのブロックでcfincludeを実行することはできません。そのコードはサーバーではなくブラウザで実行されるためです。

Answer 2

JavaScriptはクライアント側です。 ColdFusionはサーバー側です。 2つをミックスしたい場合は、Ajaxが必要です。あなたは、より簡単にAjaxのためのjQueryを使用してのようなものを試してみてください：

あなたがそれらをリダイレクトする場合があります

// LOOK AT THE SCREEN WIDTH 
if (screen.width <= 700) { 
    // LOAD THE PAGE INTO THE CORRECT SIZED DIV 
    $("#YourDiv").load("ColFusionFile-01.cfm"); 
} else { 
    // LOAD THE PAGE INTO THE CORRECT SIZED DIV 
    $("#YourDiv").load("ColFusionFile-02.cfm"); 
} 

または、：

// LOOK AT THE SCREEN WIDTH 
if (screen.width <= 700) { 
    // SEND THE VISITOR TO THE CORRECT SIZED PAGE 
    window.location.href = "ColFusionFile-01.cfm" 
} else { 
    // SEND THE VISITOR TO THE CORRECT SIZED PAGE 
    window.location.href = "ColFusionFile-02.cfm" 
} 

Answer 3

あなたは異なった表示レンダリング用のCSSメディアクエリおよびスタイルシートを使用する必要がありますに基づいて、画面サイズ。これにより、両方のディスプレイに対して1つのCFページを持つことができます。 AJAXは必要ありません。メディアクエリーの

W3Cのドキュメント： "レスポンシブウェブデザイン" のhttp://www.w3.org/TR/css3-mediaqueries/

グレート記事：http://mediaqueri.es/