Skip to content

Instantly share code, notes, and snippets.

@byronwade

byronwade/gist:6602088

Created September 17, 2013 23:22
Show Gist options
  • Save byronwade/6602088 to your computer and use it in GitHub Desktop.
Save byronwade/6602088 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.phtml
<?php
$con=mysqli_connect("############","blogthorbis","##############","blogthorbis");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
date_default_timezone_set('America/New_York');
?>
<!DOCTYPE html>
<html>
<head>
<title>Squint | Thorbis Inc.</title>
<style>
/******************** RESET ********************/
* { -webkit-text-size-adjust: none; border: none; margin: 0; padding: 0; text-align: left; }
/* Defined*/
body{
font-family: Arial;
background: #f5f5f5;
}
#header-area{
top:0;
left:0;
width:100%;
position: fixed;
background: #50b7dc;
-webkit-box-shadow: rgba(0,0,0,0.3) 0px 2px 2px -1px;
-moz-box-shadow: rgba(0,0,0,0.3) 0px 2px 2px -1px;
box-shadow: rgba(0,0,0,0.3) 0px 2px 2px -1px;
border-bottom: 1px solid #2693ba;
z-index: 1000;
}
.container{
width: 100%;
margin-right: auto;
margin-left: auto;
}
.caret {
display: inline-block;
width: 0;
height: 0;
vertical-align: center;
border-top: 4px solid #fff;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
content: "";
}
#header-area > .container{background: rgba(124, 124, 124, 0.2);}
.menu{
list-style: none;
margin: 0px;
font-size: 12px;
color: #fff;
cursor: pointer;
}
.menu > li.logo{
font-weight: bold;
font-size: 14px;
}
.menu > li{
display: inline-block;
padding: 13px 10px 13px 10px;
/*font-weight: bold;*/
min-width: 100px;
text-align: center;
}
/*.menu >li.submenu { text-transform: uppercase; }*/
.menu > li.submenu:hover{ background: rgba(124, 124, 124, 0.3);/*#ddf0f9;*/}
.menu > li.dropable:hover{ color: #50b7dc; background: #ddf0f9;}
/*.menu > li.dropable:after{content: "&#8203";}*/
.dropmenu{
color: #fff;
position: absolute;
left: 0;
z-index: 999;
display: none;
width: 100%;
margin: 0px 0 0;
height: 250px;
list-style: none;
border-bottom: 5px solid #50b7dc;
background-color:black;
}
.dropmenu > .container{
font-size: 14px;
font-weight: bold;
}
.dropmenu > .container > .tag{
width: 250px;
min-height: 250px;
background: #c7e6f5;
color: #0698dd;
display: block;
margin-bottom: 6px;
position: relative;
float: left;
}
.dropmenu > .container > .tag > ul{list-style: none; padding-top: 10px;}
.dropmenu > .container > .tag > ul > li{padding: 5px; text-align: right; padding-right: 20px;}
.dropmenu > .container > .tag > ul > li > a{ text-decoration: none; color: inherit;}
.dropmenu > .container > .tag > ul > li:hover{background: #ddf0f9;}
.dropmenu > .container > .feature > ul{list-style: none; display:block;}
.dropmenu > .container > .feature{
/*position: relative; */
float: left;
}
.dropmenu > .container > .feature > ul > li{
width: 200px;
padding: 10px;
margin: 5px;
display: inline-block;
}
.dropmenu > .container > .feature > ul > li > a{ text-decoration: none; }
.dropmenu > .container > .feature > ul > li > a > img{ width: 200px; height: 150px;}
.dropmenu > .container > .feature > ul > li > a > p{ text-align: center; color: #ffffff;}
</style>
</head>
<body>
<!-- Header Begins-->
<div id="header-area">
<div class="container">
<ul class="menu">
<li class="logo">Thorbis Inc.</li>
<li class="submenu" id="home">HOME</li>
<li class="submenu dropable">TECH &nbsp;<span class="caret"></span>
<div class="dropmenu">
<div class="container">
<div class="tag">
<ul>
<li><a href="#">All Techs</a></li>
<li><a href="#">Apps and Software</a></li>
<li><a href="#">Tablets</a></li>
<li><a href="#">Laptops</a></li>
<li><a href="#">Cellular</a></li>
</ul>
</div>
<div class="feature">
<ul>
<?php
if ($Res = mysqli_query($con,'SELECT * FROM `Blog` ORDER BY `Date` DESC LIMIT 4')) {
while($Row = $Res->fetch_object()) {
$BlogURL = $Row->BlogURL;
$p = $Row->BlogP;
$ext = $Row->filetype;
$title = $p;
if (strlen($title)>200){
$rtitle = substr($title,0,200)."...";
}else {
$rtitle = $title;
}
echo '
<li><a href="'.$BlogURL.'">';
if($ext == 'image/jpeg' || $ext == 'image/jpg' || $ext == 'image/png' || $ext == 'image/gif'){echo '<img src="'.$Row->upload_location.'"></img>';}
elseif($ext == 'audio/mp3' || $ext == 'audio/ogg'){echo '<audio controls class="floatright blogmusic" src="'.$Row->upload_location.'"></audio>';}
elseif($ext == 'video/mp4' || $ext == 'audio/ogg'){echo '<video controls class="floatright blogvideo" src="'.$Row->upload_location.'"></video>';}
echo'
<p>'.$Row->BlogTopic.'</p>
</a></li>
';
}
}
?>
</ul>
</div>
</div>
</div>
</li>
<li class="submenu dropable">ENTERTAINMENT &nbsp;<span class="caret"></span>
<div class="dropmenu">
<div class="container">
<div class="tag">
<ul>
<li><a href="#">All Entertainment</a></li>
<li><a href="#">Film</a></li>
<li><a href="#">Gaming</a></li>
<li><a href="#">Sports</a></li>
<li><a href="#">Tevelision</a></li>
</ul>
</div>
<div class="feature">
<ul>
<?php
if ($Res = mysqli_query($con,'SELECT * FROM `PublicBlog` ORDER BY `Date` DESC LIMIT 4')) {
while($Row = $Res->fetch_object()) {
$BlogURL = $Row->BlogURL;
$p = $Row->BlogP;
$ext = $Row->filetype;
$title = $p;
if (strlen($title)>200){
$rtitle = substr($title,0,200)."...";
}else {
$rtitle = $title;
}
echo '
<li><a href="'.$BlogURL.'">';
if($ext == 'image/jpeg' || $ext == 'image/jpg' || $ext == 'image/png' || $ext == 'image/gif'){echo '<img src="'.$Row->upload_location.'"></img>';}
elseif($ext == 'audio/mp3' || $ext == 'audio/ogg'){echo '<audio controls class="floatright blogmusic" src="'.$Row->upload_location.'"></audio>';}
elseif($ext == 'video/mp4' || $ext == 'audio/ogg'){echo '<video controls class="floatright blogvideo" src="'.$Row->upload_location.'"></video>';}
echo'
<p>'.$Row->BlogTopic.'</p>
</a></li>
';
}
}
mysqli_close($con);
?>
</ul>
</div>
</div>
</div>
</li>
<li class="submenu">BUSINESS</li>
</ul>
</div>
</div>
<!--Header Ends-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.dropable').hover(function(e){
e.preventDefault();
var drop = $(this).find('.dropmenu');
/*var c = $(this).css('backgroundColor');
drop.css('backgroundColor', c);*/
drop.stop().slideDown('fast');
}, function(e){
e.preventDefault();
$(this).find('.dropmenu').stop().slideUp('fast');
});
});
</script>
</body>
<div style="margin-top:110%; background-color:grey;"></div>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment