Bryan Hadaway

[JavaScript] Simple Dropdown Menu I'm Working On

2011-01-02T12:42:01-08:00

The menu now is CSS/HTML only and is as minimalist as I could make it. I would love to here suggestions on how I could make it even simpler, but what I really need help with is what the simplest JS fix I could apply to make it work in IE?

Code below; live demo here: http://www.bryanhadaway.com/pure-css-only-dropdown-menu/

Thanks, Bryan

<html>

<head>

<title>Simple CSS Only Dropdown Menu</title>

<style>

.dropmenu ul, .dropmenu ul li{
display:inline;
margin:0;
padding:0;
list-style:none}

.dropmenu ul li{position:relative}

.dropmenu ul li a{
display:inline-block;
width:120px;
font-family:georgia;
font-size:14px;
color:#000;
text-align:center;
text-decoration:none;
background:#ddd;
margin:-2px 0px 0px 0px;
border:#999 2px solid;
padding:3px 7px 3px 7px}

.dropmenu ul li a:hover{
display:inline-block;
width:120px;
font-family:georgia;
font-size:14px;
color:#666;
text-align:center;
text-decoration:none;
background:#eee;
margin:-2px 0px 0px 0px;
border:#ccc 2px solid;
padding:3px 7px 3px 7px}

.dropmenu li ul{
display:none;
position:absolute;
top:23px;
left:0px}

.dropmenu ul li:hover ul{display:inline-block}

.dropmenu ul ul, .dropmenu ul li:hover ul ul, .dropmenu ul ul li:hover ul ul{display:none}

.dropmenu ul li:hover ul, .dropmenu ul ul li:hover ul, .dropmenu ul ul ul li:hover ul{display:block}

</style>

</head>

<body>

<div class="dropmenu">
<ul>
<li><a href="">Parent 1</a>
<ul>
<li><a href="">Sub 1</a></li>
<li><a href="">Sub 2</a></li>
<li><a href="">Sub 3</a></li>
</ul>
</li>
<li><a href="">Parent 2</a>
<ul>
<li><a href="">Sub 1</a></li>
<li><a href="">Sub 2</a></li>
<li><a href="">Sub 3</a>
<ul>
<li><a href="">Sub Sub 1</a></li>
<li><a href="">Sub Sub 2</a></li>
<li><a href="">Sub Sub 3</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="">Parent 3</a>
<ul>
<li><a href="">Sub 1</a></li>
<li><a href="">Sub 2</a></li>
<li><a href="">Sub 3</a>
<ul>
<li><a href="">Sub Sub 1</a></li>
<li><a href="">Sub Sub 2</a></li>
<li><a href="">Sub Sub 3</a>
<ul>
<li><a href="">Sub Sub Sub 1</a></li>
<li><a href="">Sub Sub Sub 2</a></li>
<li><a href="">Sub Sub Sub 3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>

</body>

</html>

[PHP] On Canonical Link Code | Remove Param / Query Strings

2010-06-07T08:20:11-07:00

Full solution here: http://www.bryanhadaway.com/super-simple-dynamic-canonical-link-code/

[PHP] On Canonical Link Code | Remove Param / Query Strings

2010-05-30T14:14:40-07:00

Okay, I've worked out the code that does exactly what I want (see below). But I need help refactoring it to adapt to the syntax of my code above. Thanks

<link rel="canonical" href="http://<?php echo $_SERVER["HTTP_HOST"] ?><?php echo parse_url($_SERVER['REQUEST_URI'],PHP_URL_PATH); ?>â€ />

[PHP] Canonical Link Code | Remove Param / Query Strings

2010-05-28T08:07:27-07:00

Take a look at what I've written so far. In the way I'm using this it almost works perfect in all scenarios even removing hash # and everything after, but I have run into query strings.

I need one version that removes just & and everything after and another that removes ? and everything after, I've been looking for a clean minimalist solution for the past 2-3 days with nothing close.

Thanks, Bryan

<?php
function canlink() {
echo '<link rel="canonical" href="http://' . $_SERVER["HTTP_HOST"] . $_SERVER["REQUEST_URI"] . '" />';
}
?>