Something new

Just a test of a different top menu.  Yall are welcome to give advice.  I probably won't listen to it, but you're welcome to give it.

http://houstonlively.com/?skin=somethingNew

This design is very preliminary/

quite nice. Different which is always good.

Would be a nice touch if you made the background float as you have all the boxes and stuff looking like they're hovering... 

Nice.... with some room for improvements. 

 RE:

 At the time you saw it, there's no telling what you may have seen... I was working on it live.

I decided to take a slightly different route with the main navigation menu design.  Hovering on the bar icon in the upper right corner bring it up.  The icon will still be visible when the page is scrolled, so the menu is always accessible... no need to scroll the page to get to the menu.  It's also a little more mobile friendly... I can even use it on my iPhone.  Too bad the rest of the site is microscopic on the iPhone.... maybe I'll work on that.

I wonder if people will figure out how to get to the menu.

now that's what i call impressive, it's different, it looks & works great (especially on an iphone compared to normal menu's), the menu even stays open when you scroll using a mouse wheel, not to mention the fact that the colour is a perfect fit for my site 

Nice and slick design. And the menu is impressive!

Boring.

 RE:

 It's more about the menu design, than the colors.  I'm working on getting all the standard navigation clutter out of the way... until it's actually needed.

I now added mobile browser detection to the template, which unloads about a half dozen css files and reloads the mobile version counterpart.  It's still very much a work in progress, but you can check it out here:

http://houstonlively.com?skin=somethingNew

Visit the link with your PC browser, then look at it with your smartphone browser to see the differences.

As an alternative, you can use the user agent switcher for Firefox:

https://addons.mozilla.org/en-US/firefox/addon/user-agent-switcher/

(The little bar icons bring up menus)  Main menu is the bar icon in the upper right.  Sub menus are also accessed from the bar icon next to page titles.

Useful comments are welcome, but if all you have to say is a comment on the boring, bland color scheme.... keep it to yourself.

I just got tired of all the BS about responsive templates that do nothing more than change the layout when the browser window is resized.  Big fck whoopee..... the templates adapt to different browser window sizes.... who gives a rat's ass?  Go visit a "responsive template" demo with your iPhone, etc... then look at this one.

the menu looks really good. if this is tweaked a lil further it's a very nice feature for the mobile and tablets.

I tested your site with the menu on my samsung and the first time on load it looks good and resizes fine but if you reload the site again the resize isn't working properly and the menu doesn't work.

This is the stuff that will bring the dolphin site to a new level!!

Looking forward to the new features your bring...

 RE:

 Things like this, is what will make this a real pain to get all the bugs out.  The only mobile Phone I have, is an iPhone, so it's going to be hard to track things down.  So far, I don't see too many problems on iPhone.  But.... this is very preliminary, and I know I still have a lot to learn about designing pages for mobile browsers.

 That's very good insight and it had to come from a Texan,  I like your work and keep giving 'em hell, a complement from a, Texan. When will it become available for the masses?

This is excellent. When will I be able to use it on my live site?

The floating icon Menu is a stroke of genius and works well.

On my Samsung Note 3 the menu comes up but the 'Login' icon hovers above the Menu's Home button. Also, some of the menu items do not work on the Note 3 though they do work on my computer using Firefox.

Welcome back Houston!

Stuart

yes very nice i like..

RE:

I  added a z-index value to the Login button, but that's just guess work.  Fore debugging purposes, the main menu icon will be red for the mobile version, and white for the standard version.  I assume the Note 3 is a Phone?  If anybody sees a problem, it would be helpful to say exactly what sort of device you are using, and not just give the trade name of it.  I used to have the names of all 30,000 pc's, tablets, notebooks, and phones in my head, but it made my head hurt, so I decided to forget it all.

RE:

 Can you be more specific?  The only thing I can ascertain from this input, is that your Note 3 is a POS.

 RE:

Either when I get all the bugs out, or when I get tired of working on it.... whichever comes first. 

@Stuart

Reload the page and check the behavior again.

Turns  out,  position: fixed + z-index + mobile Chrome = problem (my comment about Note 3 a POS, wasn't that far off)

It should now behave properly on your Samsung note 3 Phone.

I just got a brand new iPhone 5C.

On both safari and chrome. Only noticed one glitch. If i click on the menu. It opens. If i click close on the menu. The menu closes then click on either the Login or the Join button and the menu opens back up. I have to hit home on the menu before the Login or Join buttons will work again.

EDIT. Also IOS 7.1.1 if that makes a difference.

Strange.  That close button is just a link:

<li class="sys-icon top"><a class="top_link menu_close"><i class="sys-icon tm_Close"></i>Close</a></li>

With the function below in navigation_menu.html

<script>
$(document).ready(function(){
  $("a.menu_close").click(function(){
    $("ul.mainNavMenu").addClass("ulClose");
  });
});
$(document).ready(function(){
  $("a.menu_close").mouseout(function(){
    $("ul.mainNavMenu").removeClass("ulClose");
  });
});
</script>

<style>
.ulClose {
display:none !important;
}
</style>

My ancient iPhone 4 behaves normally.  I don't know what in the above code could be affecting login buttons.  I suppose I could try different methods of opening and closing the menu.... I'd first need to understand why it behaves like that on your device, but for now, I'm at a loss.

Maybe you observed this behavior when I was working on it.  The way I've been working on it live, you may have seen something totally different from one minute to the next.

Not sure why i keep using the word click when on the iphone you actually tap.

Anyhow. I have tried several times over a half hour or so time frame.

very nice menu.

although wont open on my iphone 4 (not s) ios 6.1.3

Testing on a Samsung Galaxy 4 (Android 4.4.2), It looks pretty good. The only things I have noticed so far is:

- Taping the 'Join' button sends you to the homepage. This also happens using my desktop.

- Trying to access the 'sub-menus' from a module (ex. photos) will also send you to the homepage since you cannot 'hover' over it like you can with a mouse.

 RE:

 That might have something to do with the redirect to the homepage I put in join.php

 RE:

Are you sure just hovering your finger over the icon doesn't bring up the menu?  You mean you actually have to touch the screen???

Hah. Well, technically I can turn on 'Air View' and be able to hover over the screen without touching it but I'm sure not all devices will be able to.

I may change the way the whole thing works and just call an entirely new template when a mobile browser is detected.  Loading and unloading different css is no problem, but both desktop and mobile browsers will have to share the same template html files.  So.... I think I'll  switch everything when a mobile browser is detected. 

I can already see that a different method is needed to pull up the menu on a mobile device, because the hover pseudo class doesn't behave well enough on those devices.  Every mobile device user is accustomed to the tap response they get within a native app running on the device, and the tap response on a:hover is drastically different, and too inconsistent from one device to another.

I like what you have so far HL. I have a real job now (stupid i guess) so I am busy as hell these days but i will keep an eye on this thread.

Thanks for that Houston.

Stuart