How to make CSS hide a PHP routine

Asked

Viewed 395 times

0

I need a routine PHP another is hidden and displayed using CSS. 'Cause I have a routine in PHP which generates column numbers to display my information, but it will be necessary that when the browser is at a certain width the column number is changed.

See below my PHP with CSS:

<span class="mobile_detect">
<?php
$colunas = 3;
?> 
</span>

Above is what I need. But it’s not working, it keeps assigning the number 3 to the variable when the browser is resized. If I remove the script PHP and put a text, for example, it hides quietly. It’s just not hiding the script PHP.

CSS

.mobile_detect{
  display: none;
}
  • $colunas = 3; only sets the variable does not write anything in that location. For this you will need a echo. Resizing has to come from media queries. Which means that php will have to write each specific value within each media query.

  • @Isac Hello, the whole routine with @media Queries is working perfectly. This is just a snippet. If I remove the PHP script and put a text, for example, it hides quietly. Just not hiding the PHP script. And I don’t know why!

  • Hide php’s script ? What do you mean? The script is never visible on the page ,just its output, i.e..

  • You need to study what it is client-side and what is server-side. Here’s a question to start.

2 answers

1

If I got it right If I wanted to hide the code generated by the script until it is resized, it would not even be displayed in the source code, would that be it? or php code is being displayed even with css to hide it?

type if it is not to display it in the source code until the moment it is resized Voce will have to make a request to the server again requested the page snippet using ajax or even iframe, let’s see a simpler example, a div where there is nothing written when you press the button it pulls this information from the server and mounts without leaving the page itself

html code

<html>
<script>
  function kodo_puxar(){
     //aqui ele pega o div pelo id
     var meudiv = document.getElementById("kami");
     //instanciamos o objeto
     var meureq = new XMLHttpRequest();
     //especificamos a url e o metodo
     meureq.open("get","http://192.168.1.1/kodo/puxar.php",false);
     //fazemos a requisição
     meureq.send();
     //jogamos a resposta no div
     meudiv.innerHTML = meureq.responseText;
  }
</script>
<body>
<h1>exemplo stackoverflow by kodo</h1><hr>
<div id="kami">
</div>
<input type="button" value="puxar" onclick="kodo_puxar()">
</body>
</html> 

in php code we generate html

<?php
  echo '<font color="red">testando</font>';
?>

if we look at the page (source code) the php code has not been generated yet

inserir a descrição da imagem aqui

but when we press the button the request is made on the server pulled the new code

inserir a descrição da imagem aqui

Voce can for example pass as argument the dimension of the page and create the html code again based on it only if it is at the desired size, Voce can use events to know when it was resized or in the gambiarra using setInterval, as it is also possible to do this directly in javascript (however in this case the client will have access to the source code data)

0


it continues assigning the number 3 to the variable when the browser is resized

What you want is impossible. Assigning the value to the variable happens before anything is displayed on the screen - and it doesn’t change. When PHP processing ends and HTML is sent to the browser, nothing else can be changed.

Already the CSS is applied after the HTML is rendered in the browser, that is, well after the logic you determined there.

You need to change the logic of your program to not depend on a PHP variable when you need to modify the layout. You can do this assignment in Javascript for example.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.