...

View Full Version : mega menu: changing the position of sub menu



LJackson
05-01-2011, 12:18 AM
Hi all,

im trying to create a mega menu and have followed a tutorial to do so, and it looks as it should :)

i was wondering if it were at all possible to:

1/
have the sub menus appear directly under the menu like the first and last sub menu and not to be positioned relitave the their parent li menu item?
here is my test page
(http://www.kernow-connect.com/menu_drop.php)
can anyone help me acheive this please?

many thanks
Luke

Excavator
05-01-2011, 01:40 AM
Hello LJackson,
Instead of making the li relative, using position: relative; on the parent ul will position each of your dropped divs from the same point.
Like this (changes highlighted in red):


#menu li {
float:left;
text-align:center;
/*position:relative;*/
padding: 4px 10px 4px 10px;
margin-right:30px;
margin-top:7px;
border:none;
}
#menu {
list-style:none;
width:940px;
margin:30px auto 0px auto;
height:53px;
padding:10px 20px 0px 20px;

/* Rounded Corners */

-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;

/* Background color and gradients */

background: #014464;
background: -moz-linear-gradient(top, #0272a7, #013953);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0272a7), to(#013953));

/* Borders */

border: 1px solid #002232;

-moz-box-shadow:inset 0px 0px 1px #edf9ff;
-webkit-box-shadow:inset 0px 0px 1px #edf9ff;
box-shadow:inset 0px 0px 1px #edf9ff;
position: relative;
}

LJackson
05-01-2011, 02:00 AM
wow thanks so much mate!!!!!!!!!!

works a treat
cheers

LJackson
05-01-2011, 07:11 PM
ok im really stuck, im in the process of adding data to the drop downs, 'retail stores' to be specific, you will notice when you hover over discount codes a list of stores appear grouped by letter.

now the trouble im having is that i want the stores to appear as they are 'one under another' but instead of continuing outside of the div create a new 'column' inside and carry on so it woul look something like this

a f k p u
b g l q v
c h m r w
d i n s x
e j o t y
z

and not
a b c d e f
g h i j k l m
n o p q r s
t u v w x y z

here (http://www.kernow-connect.com/menu_drop.php) is my page again
any ideas how this can be acheived pref just using css

many thanks

LJackson
05-02-2011, 03:57 PM
ok ive kinda sorted it but its meant that ive just reused a section of code several times for a group of stores... but can anyone condense it for me so that its not such a mess.


<?php
mysql_query("SET NAMES 'utf8'");

$query = mysql_query("SELECT UPPER(SUBSTRING(stores.storeName,1,1))
AS letter, storeID, storeName, rating
FROM stores ORDER BY storename ASC")or die(mysql_error());

while ($records = @mysql_fetch_array ($query))
{
$alpha[$records['letter']] = !isset($alpha[$records['letter']]) ? 1 : $alpha[$records['letter']] + 1;
${$records['letter']}[$records['storeID']] = $records['storeName'];
}


echo "<ul>";
// Create Alpha link Listing;
echo "<li>";
echo "<div style='height:14px; font-weight:bold;'>0-9</div>";
foreach(range('0','9') as $i)
{
if (array_key_exists ("$i", $alpha))
{
$count = 1;
foreach ($$i as $key=>$value)
{
$stores = "SELECT *
FROM stores
WHERE storeID = '$key'";
$query = mysql_query($stores);?>
<?php
while ($row = mysql_fetch_array($query))
{
$name = $row['name'];
$storename = trim(htmlspecialchars($row['storeName']));
$ids = $row['storeID'];
$link = htmlspecialchars($row['storeLink']);?>
<a href='<?php echo $link?>'><?php echo $storename.", ";?></a><?php
$count++;
}
}
}
}
echo "</li>";

// Create Alpha link Listing;
foreach(range('A','E') as $i)
{
if (array_key_exists ("$i", $alpha))
{
$count = 1;
echo "<li>";
echo "<div style='height:14px; font-weight:bold;'>".$i."</div>";
foreach ($$i as $key=>$value)
{
$stores = "SELECT *
FROM stores
WHERE storeID = '$key'";
$query = mysql_query($stores);?>
<?php
while ($row = mysql_fetch_array($query))
{
$name = $row['name'];
$storename = trim(htmlspecialchars($row['storeName']));
$ids = $row['storeID'];
$link = htmlspecialchars($row['storeLink']);?>
<a href='<?php echo $link?>'><?php echo $storename.", ";?></a><?php
$count++;
}
}
echo "</li>";
}
#echo "</ul>";
}
echo "</ul>";

echo "<ul>";

// Create Alpha link Listing;
foreach(range('F','L') as $i)
{
if (array_key_exists ("$i", $alpha))
{
$count = 1;
echo "<li>";
echo "<div style='height:14px; font-weight:bold;'>".$i."</div>";
foreach ($$i as $key=>$value)
{
$stores = "SELECT *
FROM stores
WHERE storeID = '$key'";
$query = mysql_query($stores);?>
<?php
while ($row = mysql_fetch_array($query))
{
$name = $row['name'];
$storename = trim(htmlspecialchars($row['storeName']));
$ids = $row['storeID'];
$link = htmlspecialchars($row['storeLink']);?>
<a href='<?php echo $link?>'><?php echo $storename.", ";?></a><?php
$count++;
}
}
echo "</li>";
}
#echo "</ul>";
}
echo "</ul>";

echo "<ul>";

// Create Alpha link Listing;
foreach(range('M','R') as $i)
{
if (array_key_exists ("$i", $alpha))
{
$count = 1;
echo "<li>";
echo "<div style='height:14px; font-weight:bold;'>".$i."</div>";
foreach ($$i as $key=>$value)
{
$stores = "SELECT *
FROM stores
WHERE storeID = '$key'";
$query = mysql_query($stores);?>
<?php
while ($row = mysql_fetch_array($query))
{
$name = $row['name'];
$storename = trim(htmlspecialchars($row['storeName']));
$ids = $row['storeID'];
$link = htmlspecialchars($row['storeLink']);?>
<a href='<?php echo $link?>'><?php echo $storename.", ";?></a><?php
$count++;
}
}
echo "</li>";
}
#echo "</ul>";
}
echo "</ul>";

echo "<ul>";

// Create Alpha link Listing;
foreach(range('S','Z') as $i)
{
if (array_key_exists ("$i", $alpha))
{
$count = 1;
echo "<li>";
echo "<div style='height:14px; font-weight:bold;'>".$i."</div>";
foreach ($$i as $key=>$value)
{
$stores = "SELECT *
FROM stores
WHERE storeID = '$key'";
$query = mysql_query($stores);?>
<?php
while ($row = mysql_fetch_array($query))
{
$name = $row['name'];
$storename = trim(htmlspecialchars($row['storeName']));
$ids = $row['storeID'];
$link = htmlspecialchars($row['storeLink']);?>
<a href='<?php echo $link?>'><?php echo $storename.", ";?></a><?php
$count++;
}
}
echo "</li>";
}
#echo "</ul>";
}
echo "</ul>";


?>


would appreciate it a lot, thanks
Luke



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum