It's me again - The code is working now, but I can't seem to be able to add a link to the '$info['name']' in the alt.
I want to be able to add links to the picture and the name. The picture link works, but the link does not appear in the name.
I may have some mistakes in the code below.
The link works on the picture but now in the alt.
Here's the code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>JQuery Cycle Plugin - Pager Demo with Prev/Next Controls</title>
<link rel="stylesheet" type="text/css" media="screen" href="../jq.css" />
<link rel="stylesheet" type="text/css" media="screen" href="cycle.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript" src="http://malsup.github.com/chili-1.7.pack.js"></script>
<script type="text/javascript" src="http://malsup.github.com/jquery.cycle.all.js"></script>
<style type="text/css">
#main { margin: 20px }
#nav { margin: 10px; position: relative }
#nav li { float: left; list-style: none}
#nav a { margin: 5px; padding: 3px 5px; border: 1px solid #ccc; background: #fc0; text-decoration: none }
#nav li.activeSlide a { background: #faa; color: black }
#nav a:focus { outline: none; }
</style>
<script type="text/javascript">
$(document).ready(function() {
$('#slideshow').cycle({
prev: '.prev', // Setup prev links
next: '.next', // Setup next links
pager: '.nav', // Setup pager navs
before: function () {
$("#name").html($(this).children("img").attr("alt"));
}
});
});
</script>
<style type="text/css">
#left, #slideshow, #right { float: left; width: 200px; }
</style>
</head>
<body>
<!-- left nav bar -->
<div id="left">
<span class="prev">Prev</span>
<span class="next">Next</span>
<ul class="nav"></ul>
</div>
<!-- slideshow -->
<div id="slideshow">
<?php
mysql_connect("localhost", "root", "")or die("cannot connect");
mysql_select_db($db_name)or die("cannot select DB");
$data = mysql_query("SELECT * FROM people") or die(mysql_error());
while($info = mysql_fetch_array( $data )){
<!--THIS CODE BELOW -->
echo "<img src=\"uploads/".$info['pic'] . "\" alt=\"<b><a href=\"display.php?id=".$info['id']."\">".$info['name']."</b><br />".$info['sex']. "<br />".$info['location'].
"<br />".$info['age']."</a>";
}
?>
</div>
<div id="name">
</div>
<!-- right nav bar -->
<div id="right">
<span class="prev">Prev</span>
<span class="next">Next</span>
<ul class="nav"></ul>
</div>
</div>
</body>
</html>
I would appreciate your help folks to be able to add link to the name dynamically.
instead of echo-ing the string, why not read it into a variable and echo the variable inside you html at the appropriate location <?php echo $myString; ?> also looks like you are using HTML inside the alt attribute. You can't do that. Even if you can do that, you are using double quotes inside double quotes, which will end the double quote and break the string.
Try changing your echo command to:
echo "<img src=\"uploads/".$info['pic'] . "\" alt=\"<b><a href='display.php?id=".$info['id']."'>".$info['name']."</b><br />".$info['sex']. "<br />".$info['location'].
"<br />".$info['age']."</a>";
The only thing Ive changed is the anchor link (i.e. the part below I replace " with '
<a href='display.php?id=".$info['id']."'>
Related
I'm trying to put borders in my code with "float: left" to try to obtain this solution:
But when I put in the CSS the "border" style, I obtain this:
My code and solution:
php code:
<?php
function pinta($n,$m){
$cadena="";
for($i=0;$i<$n;$i++){
for($j=0;$j<$m;$j++){
$x = 0+$i*10;
$y = 0+$j*10;
$cadena.="<div style='background-color:rgb(0,$x,$y); '> </div>";
}
$cadena.="<br/>";
}
return $cadena;
}
?>
<!DOCTYPE HTML>
<!-- start static html -->
<html>
<head>
<title>cursor</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="estilo.css">
<script src="script.js"></script>
</head>
<body>
<?php
echo pinta(9,9);
?>
<script>
</script>
</body>
</html>
css code:
div{
width:40px;
float: left;
}
Try this:
div{
width: 40px;
border: 1px solid black;
display: inline-block;
}
Example
I am trying to include an external css into my PHP file:
<head>
<link rel="stylesheet" type="text/css" href="css/base.css">
</head>
my CSS File:
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
width: 100%;
margin: auto;
display: block;
margin-top:50px;
}
body {
font: 20px Montserrat, sans-serif;
line-height: 1.8;
overflow-y:hidden;
}
.container-fluid {
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAWklEQVQoU2P8P5PhPwMDAwNjOgMjiMYFGIlWiM2E1oMvwbZU24vDbUFYN/P/f4Z0RjAfv0J8DgT5AUM3ksnIejEV4jAZa5B8mhkH9gxf+iIsnkEyiWiF2GwHAGuiJAtmjT1hAAAAAElFTkSuQmCC);
repeat;
position: relative;
padding-bottom: 70px;
}
p{
}
.btn-success {
background-color: #85C1E9;
border:0;
}
.bg-1 {
background-color: #1abc9c; /* Green */
color: #ffffff;
}
.bg-2 {
background-color: #474e5d; /* Dark Blue */
color: #ffffff;
}
.bg-3 {
background-color: #ffffff; /* White */
color: #555555;
}
.navbar {
padding-top: 0px;
padding-bottom: 0px;
border: 0;
border-radius: 0;
margin-bottom: 0;
font-size: 15px;
letter-spacing: 4px;
}
col-sm-4:hover {
color:#85C1E9;
}
.navbar-nav li a:hover {
color: #85C1E9 !important;
}
.helper {
margin:auto;
padding-top: 50px;
}
.col-sm-4:hover {
background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAJklEQVQYV2OMq7zlw4ADMIIkF7WrbUGX/3+G4f+ASS4MVtuMzcEAiGEnwSwsT0sAAAAASUVORK5CYII=")
repeat;
}
The stylesheet is obviously used, but the plaintext is also seen in the PHP file. If tried adding type or leave it away, href as /css/base.css and without leading /, but somehow I won't get rid of the plain text in my file. Any Idea whats causing it?
The PHP File:
<html>
<head>
<title>Awesome Title</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/base.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/my.js"></script>
<script>
...
</script>
<header id="myPage" data-spy="scroll" data-target=".navbar" data-offset="50">
...
</head>
</header>
<body>
..
</body>
EDIT:
Found the error, there was a sneaky include(css/base.css)
I tried to validate your css using the W3 Css validator and it told me there's a parse error in your css. Namely you're closing the background-image: with a semicolon while on the line below theres a repeat;. This is a syntax error, and I think because it can't parse the css, it's just displayed as plain text.
You should know if you want to give styles to php output commands, like echo or print you have to type all of your html codes .
And type your php codes middle of body tags in HTML format . Like this :
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<?php
$text = "Hello World !";
echo "<p>" . $text . "</p>";
?>
</body>
</html>
But another problem that your code has is you typed a header tag inside head tags and close it after head closing tag and this will break the html programming grammar .
I am trying to implement JQueryUI resizable. It's not working below is my tentative demo which I will implement later in actual code. Please help me to solve it. It's not working.
<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.20/themes/base/jquery-ui.css" type="text/css" media="all" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<style>
#resizable { width: 150px; height: 150px; padding: 0.5em; }
#resizable h3 { text-align: center; margin: 0; }
.ui-resizable-helper { border: 1px dotted gray; }
</style>
<script>
$(function() {
//var a = $("#resizable").html();
//alert(a);
$("#resizable").resizable();
});
</script>
</head>
<body>
<div id="demo-frame">
<meta charset="utf-8">
<div class="demo">
<div class="ui-widget-content ui-resizable" id="resizable">
<h3 class="ui-widget-header">Resizable</h3>
<div class="ui-resizable-handle ui-resizable-e" style="z-index: 1000;"></div>
<div class="ui-resizable-handle ui-resizable-s" style="z-index: 1000;"></div>
<div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 1000;"></div>
</div>
</div>
</div>
</body>
It's the divs you have inside of your div that seem to be causing an issue. I commented them on on this jsFiddle http://jsfiddle.net/ta9N4/ and it appears to be working fine.
The method resizable() comes from jQuery UI API.
And you didn't include jQueryUI in your html page.
Go here to download it (or grab a link to this file), and include it like you did for jQuery (<script> tag).
I have been learning to use a slideshow code I saw on a website somewhere. Although I have managed to get it working with the images showing well, but I can't figure out how to show the image name in another table alongside the images when the slide changes.
I have provided the code here. so I need your help. What I'm looking for s that whenever the slideshow changes with another picture, I want the picture name displayed next to it.
Thanks for your asisstance.
Update - Here's the updated code based on Gilly3's suggestion, but I'm still confused on how to get the name displayed
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>JQuery Cycle Plugin - Pager Demo with Prev/Next Controls</title>
<link rel="stylesheet" type="text/css" media="screen" href="../jq.css" />
<link rel="stylesheet" type="text/css" media="screen" href="cycle.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript" src="http://malsup.github.com/chili-1.7.pack.js"></script>
<script type="text/javascript" src="http://malsup.github.com/jquery.cycle.all.js"></script>
<style type="text/css">
#main { margin: 20px }
#nav { margin: 10px; position: relative }
#nav li { float: left; list-style: none}
#nav a { margin: 5px; padding: 3px 5px; border: 1px solid #ccc; background: #fc0; text-decoration: none }
#nav li.activeSlide a { background: #faa; color: black }
#nav a:focus { outline: none; }
</style>
<script type="text/javascript">
$(document).ready(function() {
$('#slideshow').cycle({
prev: '.prev', // Setup prev links
next: '.next', // Setup next links
pager: '.nav', // Setup pager navs
before: function () {
$("#name").text(this.alt);
}
});
});
</script>
<style type="text/css">
#left, #slideshow, #right { float: left; width: 200px; }
</style>
</head>
<body>
<!-- left nav bar -->
<div id="left">
<span class="prev">Prev</span>
<span class="next">Next</span>
<ul class="nav"></ul>
</div>
<!-- slideshow -->
<div id="slideshow">
<?php
mysql_connect("localhost", "root", "")or die("cannot connect");
mysql_select_db($db_name)or die("cannot select DB");
$data = mysql_query("SELECT * FROM people") or die(mysql_error());
while($info = mysql_fetch_array( $data )){
echo "<img src=\"http://localhost:8080/about/images/".$info['photo'] . "\" alt=\"".$info['name'] ."\"/>";
}
?>
</div>
<div id="name">
HELP ME PRINT THE NAME HERE
</div>
<!-- right nav bar -->
<div id="right">
<span class="prev">Prev</span>
<span class="next">Next</span>
<ul class="nav"></ul>
</div>
</div>
</body>
</html>
Use either of the before or after events, depending on when you want the name to change.
$('#slideshow').cycle({
prev: '.prev',
next: '.next',
pager: '.nav',
before: function () {
$("#name").text(this.alt);
}
});
You'll need to populate alt with the name in your php. If you don't want to add a tooltip, also add title="".
echo "<img src=\"http://localhost:8080/people/uploads/".$info['pic'] . "\" alt=\"".$info['name'] . "\" title=\"\" />";
Here is what I think should work:
Add a 'data-name' attribute to each image. Something like:
echo "<img src='http://localhost:8080/people/uploads/".$info['pic']."' data-name='".$info['name']."'/>";
In the jquery.cycle plugin set an option for the 'onPrevNextEvent'. Probably something like:
$('#slideshow').cycle({
prev: '.prev',
next: '.next',
pager: '.nav',
onPrevNextEvent: function(isNext, zeroBasedSlideIndex, slideElement){
var name = slideElement.data('name');
$("#name").html(name);
}
});
Hope that helps.
Bob
I have a JQModal alert that needs to come up when a client's site is first accessed, but not show again when the index page is accessed again from inside the site. I'm not real far along in setting up session cookies so I'll be needing some explicit help, if that's possible. I've set up a short page with the vitals on it to test with: The URL is http://www.caycecookbook.com/pop_ups/jqm_onDocReady/code.php. I'm attaching the code here.
<?php session_start();
if( $_SESSION['visited'] ){
//don't show the modal box
} else {
$_SESSION['visited'] = true;
//show modal box;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Cayce CookBook</title>
<!-- >>>>>>>>>> TOGGLE-INSERT DEPENDENCIES >>>>>>>>>> -->
<!-- >>>>>>>>>> TOGGLE-INSERT DEPENDENCIES >>>>>>>>>> -->
<link href="css/vwd_up.css" rel="stylesheet" type="text/css" />
<script src="scripts/main.js" type="text/javascript"></script>
<!-- <<<<<<<<<< TOGGLE-INSERT DEPENDENCIES <<<<<<<<<< -->
<!-- <<<<<<<<<< TOGGLE-INSERT DEPENDENCIES <<<<<<<<<< -->
<!-- >>>>>>>>>> jqMODAL DEPENDENCIES >>>>>>>>>> -->
<!-- >>>>>>>>>> jqMODAL DEPENDENCIES >>>>>>>>>> -->
<script type="text/javascript" src="scripts/jquery-1.5.1.js"></script>
<script type="text/javascript" src="scripts/jqModal.js"></script>
<style type="text/css">
/* Optional: image cacheing. Any images contained in this div will be
loaded offscreen, and thus cached. Caching CSS created with the help of;
Klaus Hartl <klaus.hartl#stilbuero.de> */
#media projection, screen {
div.imgCache { position: absolute; left: -8000px; top: -8000px; }
div.imgCache img { display:block; }
}
#media print { div.imgCache { display: none; } }
</style>
<style type="text/css">
/* jqModal base Styling courtesy of;
Brice Burgess <bhb#iceburg.net> */
/* The Window's CSS z-index value is respected (takes priority). If none is supplied,
the Window's z-index value will be set to 3000 by default (in jqModal.js). You
can change this value by either;
a) supplying one via CSS
b) passing the "zIndex" parameter. E.g. (window).jqm({zIndex: 500}); */
.jqmWindow {
display: none;
position: fixed;
top: 5%;
left: 50%;
margin-left: -265px;
width: 530px;
/*width: auto;*/
background-color:#777777;
color: #333;
border: 1px solid black;
padding: 0px;
}
.jqmOverlay { background-color: #000; }
/* Fixed posistioning emulation for IE6
Star selector used to hide definition from browsers other than IE6
For valid CSS, use a conditional include instead */
* html .jqmWindow {
position: absolute;
top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}
</style>
<!-- <<<<<<<<<< jqMODAL DEPENDENCIES <<<<<<<<<< -->
<!-- <<<<<<<<<< jqMODAL DEPENDENCIES <<<<<<<<<< -->
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
$('#rename').jqm();
$('#rename').jqmShow(); // This is the line you need to add.
});
</script>
<!-- POP-UP DIV -->
<DIV class="jqmWindow" id="rename" style="padding:18px 0px 12px 0px;">
<TABLE align="center" width="530" border="0" cellspacing="0" cellpadding="0" bgcolor="#7777777">
<TR><TD align="center"><P style="margin: 12px 12px 12px 12px;"><img src="images/hey_there.jpg" width="504" height="360" border="0"></p></td></tr>
<TR><TD align="center" valign="middle"><P style="margin:6px 0px 0px 0px;">Close</p></td></tr>
</table>
</div>
</body>
</html>
You can't control js/html/css behavior explicitly from PHP.
You have two options
1) Don't include the javascript for modal box if $_SESSION['visited'] is true
2) Echo true/false from $_SESSION['visited'] to javascript code and do a logic there
Code for first option:
<?php session_start(); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Cayce CookBook</title>
<?php
if( $_SESSION['visited'] ){
} else {
$_SESSION['visited'] = true;
?>
<!-- >>>>>>>>>> jqMODAL DEPENDENCIES >>>>>>>>>> -->
<!-- >>>>>>>>>> jqMODAL DEPENDENCIES >>>>>>>>>> -->
<script type="text/javascript" src="scripts/jquery-1.5.1.js"></script>
<script type="text/javascript" src="scripts/jqModal.js"></script>
<style type="text/css">
/* Optional: image cacheing. Any images contained in this div will be
loaded offscreen, and thus cached. Caching CSS created with the help of;
Klaus Hartl <klaus.hartl#stilbuero.de> */
#media projection, screen {
div.imgCache { position: absolute; left: -8000px; top: -8000px; }
div.imgCache img { display:block; }
}
#media print { div.imgCache { display: none; } }
</style>
<style type="text/css">
/* jqModal base Styling courtesy of;
Brice Burgess <bhb#iceburg.net> */
/* The Window's CSS z-index value is respected (takes priority). If none is supplied,
the Window's z-index value will be set to 3000 by default (in jqModal.js). You
can change this value by either;
a) supplying one via CSS
b) passing the "zIndex" parameter. E.g. (window).jqm({zIndex: 500}); */
.jqmWindow {
display: none;
position: fixed;
top: 5%;
left: 50%;
margin-left: -265px;
width: 530px;
/*width: auto;*/
background-color:#777777;
color: #333;
border: 1px solid black;
padding: 0px;
}
.jqmOverlay { background-color: #000; }
/* Fixed posistioning emulation for IE6
Star selector used to hide definition from browsers other than IE6
For valid CSS, use a conditional include instead */
* html .jqmWindow {
position: absolute;
top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}
</style>
<!-- <<<<<<<<<< jqMODAL DEPENDENCIES <<<<<<<<<< -->
<!-- <<<<<<<<<< jqMODAL DEPENDENCIES <<<<<<<<<< -->
<?php
}
?>
<!-- >>>>>>>>>> TOGGLE-INSERT DEPENDENCIES >>>>>>>>>> -->
<!-- >>>>>>>>>> TOGGLE-INSERT DEPENDENCIES >>>>>>>>>> -->
<link href="css/vwd_up.css" rel="stylesheet" type="text/css" />
<script src="scripts/main.js" type="text/javascript"></script>
<!-- <<<<<<<<<< TOGGLE-INSERT DEPENDENCIES <<<<<<<<<< -->
<!-- <<<<<<<<<< TOGGLE-INSERT DEPENDENCIES <<<<<<<<<< -->
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
$('#rename').jqm();
$('#rename').jqmShow(); // This is the line you need to add.
});
</script>
<!-- POP-UP DIV -->
<DIV class="jqmWindow" id="rename" style="padding:18px 0px 12px 0px;">
<TABLE align="center" width="530" border="0" cellspacing="0" cellpadding="0" bgcolor="#7777777">
<TR><TD align="center"><P style="margin: 12px 12px 12px 12px;"><img src="images/hey_there.jpg" width="504" height="360" border="0"></p></td></tr>
<TR><TD align="center" valign="middle"><P style="margin:6px 0px 0px 0px;">Close</p></td></tr>
</table>
</div>
</body>
</html>
Replace below code in your file in below code i changed 3 things.
1> position of php code. I put php code at the end of file
2> Cookie rather than session
3> javascript popup opning code has some changes
Please apply below file after still you have some problem than let me know your prob.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Cayce CookBook</title>
<!-- >>>>>>>>>> TOGGLE-INSERT DEPENDENCIES >>>>>>>>>> -->
<!-- >>>>>>>>>> TOGGLE-INSERT DEPENDENCIES >>>>>>>>>> -->
<link href="css/vwd_up.css" rel="stylesheet" type="text/css" />
<script src="scripts/main.js" type="text/javascript"></script>
<!-- <<<<<<<<<< TOGGLE-INSERT DEPENDENCIES <<<<<<<<<< -->
<!-- <<<<<<<<<< TOGGLE-INSERT DEPENDENCIES <<<<<<<<<< -->
<!-- >>>>>>>>>> jqMODAL DEPENDENCIES >>>>>>>>>> -->
<!-- >>>>>>>>>> jqMODAL DEPENDENCIES >>>>>>>>>> -->
<script type="text/javascript" src="scripts/jquery-1.5.1.js"></script>
<script type="text/javascript" src="scripts/jqModal.js"></script>
<style type="text/css">
/* Optional: image cacheing. Any images contained in this div will be
loaded offscreen, and thus cached. Caching CSS created with the help of;
Klaus Hartl <klaus.hartl#stilbuero.de> */
#media projection, screen {
div.imgCache { position: absolute; left: -8000px; top: -8000px; }
div.imgCache img { display:block; }
}
#media print { div.imgCache { display: none; } }
</style>
<style type="text/css">
/* jqModal base Styling courtesy of;
Brice Burgess <bhb#iceburg.net> */
/* The Window's CSS z-index value is respected (takes priority). If none is supplied,
the Window's z-index value will be set to 3000 by default (in jqModal.js). You
can change this value by either;
a) supplying one via CSS
b) passing the "zIndex" parameter. E.g. (window).jqm({zIndex: 500}); */
.jqmWindow {
display: none;
position: fixed;
top: 5%;
left: 50%;
margin-left: -265px;
width: 530px;
/*width: auto;*/
background-color:#777777;
color: #333;
border: 1px solid black;
padding: 0px;
}
.jqmOverlay { background-color: #000; }
/* Fixed posistioning emulation for IE6
Star selector used to hide definition from browsers other than IE6
For valid CSS, use a conditional include instead */
* html .jqmWindow {
position: absolute;
top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}
</style>
<!-- <<<<<<<<<< jqMODAL DEPENDENCIES <<<<<<<<<< -->
<!-- <<<<<<<<<< jqMODAL DEPENDENCIES <<<<<<<<<< -->
</head>
<body>
<script type="text/javascript">
<?php if( !isset($_COOKIE["visited"]) || $_COOKIE["visited"] != true ): ?>
$('#rename').jqm();
$('#rename').jqmShow(); // This is the line you need to add.
<?php endif; ?>
</script>
<!-- POP-UP DIV -->
<DIV class="jqmWindow" id="rename" style="padding:18px 0px 12px 0px;">
<TABLE align="center" width="530" border="0" cellspacing="0" cellpadding="0" bgcolor="#7777777">
<TR><TD align="center"><P style="margin: 12px 12px 12px 12px;"><img src="images/hey_there.jpg" width="504" height="360" border="0"></p></td></tr>
<TR><TD align="center" valign="middle"><P style="margin:6px 0px 0px 0px;">Close</p></td></tr>
</table>
</div>
<?php
if( !isset($_COOKIE["visited"]) || $_COOKIE["visited"] != true )
{
$expireTime = time() + (60 * 60 * 24 * 1);
// Set cookie for 1 day or 24 hour from current time
setcookie("visited", true, );
}
?>
</body>
</html>