Re: QFIT Menu

[DBJT]

Well, Norm killed that thread before I had a chance to reply

FWIW, I tested it here in 4 browsers on 3 different machines (XP Win7 & Macbook) and looked fine to me in all cases.

So... probably not YOUR code, I'd wager

Anyway, "speaking of MENUs" also, nobody's yet been able to find any solution to MY menu issue that I posted about a LONG time ago. Over 200 views on StackOverflow but still nothing

http://stackoverflow.com/questions/2...enu-design-css

Anyone here can FIX this or at least gimme an idea where the problem really lies, much appreciated...

-DBJT

[Norm]

If stackoverflow doesn't have an answer, it's a real problem. JQuery seems to have difficulties with left, width, height and top settings which can cause problems with centering. I've noticed some JQuery elements display to the left of their left setting. Worse, the degree to which they display to the left varies depending on the height. Worse yet, on mobile devices, many of which incorrectly report screen widths and/or heights.

[DBJT]

Mobile device (my iPhone) is where I first noticed the problem, actually.

On a normal computer screen it's hardly any issue... barely even noticeable unless you work really HARD to make it appear (zoom in the browser viewport to ridiculous level and/or make the window stupidly small) but on a PHONE it's affecting usability severely: can't get the menu to scroll over left or right sometimes.

I guess maybe if I really wanna roll this menu out site-wide I'm gonna have to actually HIRE somebody and PAY to get it fixed... I hate putting known-flawed code onto any live page. Sigh.

-DBJT

[Coyote]

I still say dump the jquery nav menu and have a menu created with pure html and css. You could achieve the same effect without the bulkiness. Also, you should look up how to use Media Queries. Then you can have a menu that works better with a mobile device. The user wouldn't have to scroll around trying to get to your navigation menu.

[DBJT]

Coyote is that comment intended for Norm's menu or mine? Or both?

The idea for the menu I'm trying there is for it to float up on top when the page scrolls below it, so it's always there and doesn't need the user to "scroll around" to try to get to...

-DBJT

[Coyote]

It was intended for you DBJT my friend. I'm 99% sure you can accomplish what you want without jquery. When I get a moment I will take a look at your code and send you some ideas.

[DBJT]

Thx Coyote... I'll appreciate any info, any time you can spare to look at this.

I get your point re: JQuery but actually since I have to load JQ anyway for the forum pages (for our lightbox and the collapsible categories and Chat MODs, etc, among other things) as well as on the download page (lightbox again), I didn't really consider it to be that much more overhead for this menu. Sure it looks like a lot of extra baggage just for that simple demo page for the menu, but the menu will be everywhere, eventually, in theory... so it's all going into the same big pot of soup.

Also I kind of like the "fade" effect as the menu comes back into view... pretty slick and seems to go well with the "neon glow" shadow effect (in supported browsers) too. Can that be done with just CSS/HTML or is that specifically a JavaScript JQuery thing?

Mainly, I just want the damn thing to stay centered, LOL.

The overhead from JQuery etc isn't THAT much of a concern, is it really? My pages are otherwise (mostly) pretty lean I think, compared to some websites out there that are absolutely loaded down with social media crap and advertising garbage, plug-ins, Flash, etc etc etc.

-DBJT

[Norm]

I used to spend an absurd amount of time worrying about web overhead. I even used CSS Sprites on the qfit site, which are an incredible pain. No longer. I dropped the sprites. The menu on QFIT has far more overhead than JQuery, which is actually quite small when gzipped. And a large number of sites use it, so it may be cached. This site has numerous large files, including JQuery. But, everything over 1,000 bytes is gzipped, including dynamic content.

[Coyote]

The overhead from JQuery etc isn't THAT much of a concern, is it really?

I have always been drilled to guard against excessive load-times. Google penalizes anything over 4 seconds. I would always be more concerned about image file size slowing down a site.

[Coyote]

Thank you for that nugget of information Norm. Maybe I do obsess too much myself.

[DBJT]

Oh, yeah... I *do* take the time for image optimization, sure. That's usually a big payoff for little effort.

This little tool, RIOT the "Radical Image Optimizing Tool", is great for hand-optimizing images :

: http://luci.criosweb.ro/riot/

It sometimes gets better results than even Photoshop's automatic optimizer.

But the JQuery file in question here, version I'm using is 1.4.2 and the "min.js" minified file clocks in at only 72,328 bytes... barely one optimized graphic banner-ad file size, basically. Also loading it from a CDN might be even faster (although I usually put it on my own server anyway, just to have everything together...)

Anyway, I didn't mean to clutter up Norm's blackjack forum with all this-here tech nerd code talk, LOL -- Maybe we better take this over to the StackOverflow page about my menu problem, or just move it to PM or email.

-DBJT

[Coyote]

Will do.