Webデザイン初心者です。
現在、レスポンシブデザインにするため、画面サイズをJavaScriptで取得し、それをPHPに渡し、if文でHTMLをechoするか否かを決める、というプログラムを実装したいのですが、なかなかうまくいきません。
以下のサイトを参考にしました。
http://muumv.com/section-windowsize/
#ソースコード
Javascript
1(index.htmlに記述) 2 <script type="text/javascript"> 3 (function ($) { 4 $(function () { 5 6 //if ($(window).width() >= 650) { 7 // $(".menu_button").css("display", "none"); 8 //} 9 var setWindowSize = function () { 10 $.ajax({ 11 type: 'POST', 12 url: './index.php', // 画面サイズを渡すPHPのURL 13 dataType: 'html' , 14 data: { 15 'windowSize': $(window).width() 16 } 17 //data: 'windowSize=' + (window).width() 18 }); 19 };setWindowSize(); 20 21 // リサイズした時にsessionを更新する為 22 var timer; 23 $(window).resize(function() { 24 if (timer) clearTimeout(timer); 25 timer = setTimeout(setWindowSize, 1000); 26 }); 27</script>
php
1 <?php 2 //echo'<nav class="menu_button"><span>menu</span></nav>'; 3 session_start(); 4 5 6 if (isset($_POST['windowSize'])){ 7 // $_SESSION['windowSize'] = $_POST['windowSize']; 8 echo '<font size="7"> '+ $_SESSION['windowSize'] + '</font>'; 9 if($_POST['windowSize'] <= 649){ 10 echo'<nav class="menu_button"><span>menu</span></nav>'; 11 } 12 } 13 14 ?>
###試したこと
phpの
if(isset($_POST['windowSize']))
echo '<font size="7"> + $_SESSION['windowSize'] + '</font>';
ここで画面サイズがechoされていないので$_POST['windowSize']がnullであろうと予想し、
Javascriptの.ajax部分等をいじったりしてみたのですが、なかなかうまくいきません。
解決策をご教授いただけますと幸いです。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/09/29 19:37