If anyone can think of a better title, please let me know.
Right now I'm using a technique from this tutorial to get the width and height of the user's viewing window. It works, but only on the index.php page. I'm using a php based css file.
In the php based css file, everything would normally work fine, except that the first line at the top *$width_div_center = $GET['width']0.8; thinks the width is in string form. (Or something like that.) As a result, the $width_div_center variable is set to zero which causes a lot of issues. What am I doing wrong, or how can I get the php based css file to do a multiplication on *$GET['width']0.8 properly? Thank you for your assistance.
<html>
<head>
<title>Taylor Love</title>
<!--
<link rel="stylesheet" media="only screen and (color)" href="main.css" />
<link rel="stylesheet" href="main.css"/>
-->
<link rel="stylesheet" type="text/css" href="css/style.php" />
<?php
$content = "null";
include_once('content.php');
?>
</head>
<body class="body">
<!-- top header -->
<div class="div-center decorated-white">
<div class="header-background">
<div style="margin:10px;">
<font color="#AAA" >
hello, universe!
<?php
echo $_GET['width'] *.8;
echo "<h1>Screen Resolution:</h1>";
echo "Width : ".$_GET['width']."<br>";
echo "Height : ".$_GET['height']."<br>";
?>
</font>
</div>
</div>
</div><!-- div-center-->
<div class="div-center" style="margin-top:10px;">
<?php
include('sidenav.php');
?>
<div id="div-content" class = "decorated-white">
<?php echo $content; ?>
</div><!-- div-content-->
</div><!-- div-center-->
<div class="clear"></div>
<!-- top header
<div class="div-center decorated-white" style="margin-top:10px">
<?php
for ($i = 0; $i < 5; $i++){
echo "</br>";
}
?>
</div>-->
</body>
</html>
////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////
I appear to be having issues separating two different pages of code.
You seem to be calling style.php without any $_GET parameters.
The $_GET parameters you use in index.php are not automatically passed to the style.php. script.
Try temporary hard-coding the 'width' parameter to see if it makes any difference
<link rel="stylesheet" type="text/css" href="css/style.php?width=100" />
This is because the request for the stylesheet is a separate GET request which has no idea about the referrer's get parameters.
this is probably because $_GET variables are usually strings. That is probably the cause of your problem. You could use the function floatval() to convert it to a float.
The first line should be $width_div_center = floatval($_GET['width'])*0.8;
Related
I am currently hiding a div based on an if statement. The method I use is, use echo out a css style of display: none
Here is what I am doing specifically:
<style>
#content{
<?php
if(condition){
echo 'display:none';
}
?>
}
</style>
<body>
<div id="content">
Foo bar
</div>
</body>
My question being, Is this a good method for a hiding a div? Is it possible that browser cache the style and therefore ignore the echo-ed out css style?
Using Php in your CSS (Cascade Style Sheet) is not "proper",
Also, You can use Php in your HTML:
<body>
<?php if (condition){ ?>
<div id="content">
Foo bar
</div>
<?php } ?>
</body>
With this code, div block don't appear, (and you don't use it with JavaScript), You can use this for just hidden your div :
<body>
<div id="content" <?php if (condition){ echo 'style="display:none;"'; } ?>>
Foo bar
</div>
</body>
Why not create a class:
<style>
.hidden {
display: none;
}
</style>
And than apply it with PHP:
<div id="content" <?php print ( condition ? 'class="hidden"' : '' ); ?> >
That would not be the best way to hide a div. Since PHP is parsed server-side, you might as well have the if statement include or exclude the div instead of echoing a CSS class. The only time that would be useful with a CSS class is if you plan to use JavaScript to show the div on the page later on, while the user is on the page itself.
You could:
<div runat="server" id="theDiv">
Code behind is
{
theDiv.Visible = False;
}
or
Most people would use javascript
Heres a previous thread that will help you out:
Javascript if else statement to hide and show div
Yes, that is the standard way of hiding a div. With regard to the browser cache, it shouldn't cache this as it isn't in an external stylesheet.
I generally try to avoid using PHP Conditionals inside of CSS; especially inline CSS (CSS that is on the same page).
I would keep your CSS in its own CSS file and use the PHP conditional to either add a "hide" class to the DIV -OR- not echo the DIV at all.
<link rel="stylesheet" type="text/css" href="style.css" />
<body>
<div id="content" <?php if(conditional) : ?>class="hide"<?php endif;?>>
Foo bar
</div>
</body>
or alternatively
<?php $class = (conditional) ? "hide" : ""; ?>
<link rel="stylesheet" type="text/css" href="style.css" />
<body>
<div id="content" class="<?=$class?>">
Foo bar
</div>
</body>
or
<link rel="stylesheet" type="text/css" href="style.css" />
<body>
<?php if (conditional) : ?>
<div id="content">
Foo bar
</div>
<?php endif; ?>
</body>
Many times the div needs to be outputted so it can be re-displayed using JavaScript (e.g. carousels, sliders, etc.)
I'm getting weird results when trying to kind of make a "templating engine". Basically, I want to be able to use PHP variables that contain data from an SQL database.
What happens is that everything works properly with the PHP side, what does not is the page that needs to display this information (index.php).
I'm working on a way to get the website's name from the sql database, so I have something like that on my index:
<?php
include ('php/data/sitename.php');
?>
<!DOCTYPE html>
<html>
<head>
<title><?php echo $sitename; ?> - Home</title>
<!--Import Google Icon Font-->
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<div class="container">
<!-- HEADER: Navbar -->
<?php $navbar; ?>
<!-- MAIN: Index Page contents -->
<?php $page_index ?>
<!-- FOOTER: Footer -->
<?php $footer; ?>
<?php $sitename; ?>
</div>
<!--Import jQuery before materialize.js-->
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="js/materialize.min.js"></script>
</body>
</html>
This variable comes from a file (that has been included) called sitename.php, with the following code:
<?php
include ('../db.php');
$sql = "SELECT id, sitename FROM GeneralData";
$getname = mysqli_query($conn, $sql);
if ($getname->num_rows > 0) {
while($row = $getname->fetch_assoc()) {
$sitename = $row['sitename'];
echo $sitename;
}
}
?>
Yes, I used echo $sitename;, I know it wont echo the actual data, but I did it to test some things, and here are the results:
Including the file sitename.php to index.php will do nothing, it would be like if it did not exist. However, if I write "echo "123";" on it, it will echo 123 on index. What does not work is what I need.
If I go to sitename.php directly, it will simply output the correct SQL value I requested because I told it to echo (as I stated before). But, it wont work in index, it will simply not work.
Also, I'll leave my project structure here. It might help.
What can I do?
Thanks in advance!
try set GLOBAL for sitename
GLOBAL $sitename;
or
GLOBALS['sitename'];
$sitename = ...
EDIT
try use
$path = $_SERVER['DOCUMENT_ROOT'];
$path .= "/yourpath/yourfile.php";
include_once($path);
I have two DIVs which are floating side by side correctly but after embedding the php code as below, the whole page will not show anything. Even When I remove the php code, the page will not show again. The code below is for the div that floats right.
<div style="float:right;">
<?php
echo "<div>
<head>
<link rel='stylesheet' type='text/css' href='chatbox/style/cb_style.css'>
<script type='text/javascript' src='chatbox/ajax.js'></script>
<script type='text/javascript' src='chatbox/chatbox.js'></script>
</head>
<div>";
?>
<div id="container">
<div id="usersOnLine">
<div style="font-weight:bold;margin-top:35%;">Online Users</div>
<div style="height:82%;">
<?php
if (!empty($friends)) {
foreach ($friends as $friend) {
$friend_name = htmlentities($user['username'], ENT_NOQUOTES);
echo "<span>{$friend_name}</span>";
}
}
?>
</div>
<form method="post" action="">
<input type='text' placeholder='search' style='width:145px;'/><a href='#'><span class='glyphicon glyphicon-search'></span></a>
</form>
</div>
<div id="chat_search">
<un>
</div>
</div>
</div>
<div style="clear:both;"></div>
Since you are adding a <head> element into the DOM, you should remove that surrounding div and head and place that first chunk of php code inside your page's <head> section. The browser is getting confused when you introduce a new <head> element that way.
EDIT: to explain further, with a possible example...
You can add those new stylesheet and js entries into your head by appending them to your header include (assuming you are using an include for your main html header - in this example, we call it "header.php", since that's common)
<?php
$addme = '<link rel="stylesheet" type="text/css" href="chatbox/style/cb_style.css">
<script type="text/javascript" src="chatbox/ajax.js"></script>
<script type="text/javascript" src="chatbox/chatbox.js"></script></head>';
ob_start(); // start a buffer
include("header.php");
$contents = ob_get_contents(); // buffer the contents of header.php
ob_end_clean(); // end & clean the buffer
// replace the closing tag with the added stuff
echo str_replace('</head>', $addme, $contents);
?>
I'm actually working on a PHP project using MVC structure, including DOCTYPE & HEAD tag via a single file during an output buffering using ob°start().
The problem comes when i wanna declare a min-height property for may page container, in order to stick the footer at the bottem of the page. ob_start() -- ob_get_clean() use seems to forbid browsers to access these properties in time so they can't evaluate height value.
This is my index.php file:
<?php
include_once('global/init.php');
ob_start();
if(isset($_GET['module'])){
$module = dirname(__FILE__).'/modules/'.htmlspecialchars($_GET['module']).'/';
$action = (isset($_GET['action'])) ? htmlspecialchars($_GET['action']).'.php' : 'index.php';
if(!file_exists($module.$action)){
include('global/home.php');
}else{
include($module.$action);
}
}else{
include('global/home.php');
}
$content = ob_get_clean();
include_once('global/header.php');
echo $content;
include_once('global/footer.php');
the header.php file contains the doctype, and the first basics of html:
<html>
<head>
<meta charset='UTF-8' />
<title><?php echo "LiveSession".' '.DOMAIN_INFOS;?></title>
<meta name='description' content='<?php echo $_SESSION['currentDesc'];?>' />
<meta name='keywords' content='<?php echo $_SESSION['currentKWds'];?>' />
<link rel='stylesheet' media='screen and (max-width:480px)' href='css/smartphones.css' />
<!-- TABLETS -->
<script type='text/javascript' src='scripts/jquery.1.7.js'></script>
<script type='text/javascript' src='scripts/poll_edit.js'></script>
<script type='text/javascript' src='scripts/smartphones.js'></script>
</head>
<body>
<div id='page'>
<div id='header'>
<h1><a href='index.php'>InteractivePollSession</a></h1>
<?php
if(is_connected_user()){
echo "<span id='disconnector'><a href='index.php?module=members&action=dscnx' title='disconnect'>Disconnect</a></span>";
}
?>
</div>
<div id='contentWrap'>
the footer:
</div>
<div id='footer'>
<span id='central-footer'>© <a href='http://www.jsteitgen.com'>JSTeitgen</a></span>
</div>
</div>
</body>
And a basic css exemple:
body{height:100%;}
#page{min-height:100%; position:relative;}
#footer{position:absolute; bottom:0; width:100%;}
Does any one know how to fix this using ob_start() ?
Of course, every other CSS rules work fine except this ...
Thank's
JS
The ob_start() is not the problem. The problem is only a html/css problem. You can only use a height in percentage if the parent of the element has a fixed height.
In your case, #page parent is body and the body's height is 100%, so you can't use a height in percentage for #page. But you can try this for example :
body{height: 1000px;}
#page{min-height:100%; position:relative;}
#footer{position:absolute; bottom:0; width:100%;}
I think the problem is with the css; you are setting the body element's height to 100% of its parent, the html element, which does not necessarily have a height of 100%.
You should be able to solve your problem using:
html, body {
height: 100%;
}
I am currently hiding a div based on an if statement. The method I use is, use echo out a css style of display: none
Here is what I am doing specifically:
<style>
#content{
<?php
if(condition){
echo 'display:none';
}
?>
}
</style>
<body>
<div id="content">
Foo bar
</div>
</body>
My question being, Is this a good method for a hiding a div? Is it possible that browser cache the style and therefore ignore the echo-ed out css style?
Using Php in your CSS (Cascade Style Sheet) is not "proper",
Also, You can use Php in your HTML:
<body>
<?php if (condition){ ?>
<div id="content">
Foo bar
</div>
<?php } ?>
</body>
With this code, div block don't appear, (and you don't use it with JavaScript), You can use this for just hidden your div :
<body>
<div id="content" <?php if (condition){ echo 'style="display:none;"'; } ?>>
Foo bar
</div>
</body>
Why not create a class:
<style>
.hidden {
display: none;
}
</style>
And than apply it with PHP:
<div id="content" <?php print ( condition ? 'class="hidden"' : '' ); ?> >
That would not be the best way to hide a div. Since PHP is parsed server-side, you might as well have the if statement include or exclude the div instead of echoing a CSS class. The only time that would be useful with a CSS class is if you plan to use JavaScript to show the div on the page later on, while the user is on the page itself.
You could:
<div runat="server" id="theDiv">
Code behind is
{
theDiv.Visible = False;
}
or
Most people would use javascript
Heres a previous thread that will help you out:
Javascript if else statement to hide and show div
Yes, that is the standard way of hiding a div. With regard to the browser cache, it shouldn't cache this as it isn't in an external stylesheet.
I generally try to avoid using PHP Conditionals inside of CSS; especially inline CSS (CSS that is on the same page).
I would keep your CSS in its own CSS file and use the PHP conditional to either add a "hide" class to the DIV -OR- not echo the DIV at all.
<link rel="stylesheet" type="text/css" href="style.css" />
<body>
<div id="content" <?php if(conditional) : ?>class="hide"<?php endif;?>>
Foo bar
</div>
</body>
or alternatively
<?php $class = (conditional) ? "hide" : ""; ?>
<link rel="stylesheet" type="text/css" href="style.css" />
<body>
<div id="content" class="<?=$class?>">
Foo bar
</div>
</body>
or
<link rel="stylesheet" type="text/css" href="style.css" />
<body>
<?php if (conditional) : ?>
<div id="content">
Foo bar
</div>
<?php endif; ?>
</body>
Many times the div needs to be outputted so it can be re-displayed using JavaScript (e.g. carousels, sliders, etc.)