New feature - Widescreen mode

Started by 64Guitars, May 03, 2011, 01:29:40 PM

64Guitars

I've created a new feature to make better use of the available screen space when viewed on a large monitor. The presence of the feature is controlled by the size of the browser window. When it's small, the site looks exactly the same as before. But when you increase the size of your browser window beyond a certain point, the logo and some other items from the top banner get moved to the left side and a new side menu appears at the right. I find this menu more convenient than the top menu because all of the choices are in view at all times. I don't have to go searching for them in the drop-down menus. And the side menu stays in place even when you've scrolled down to the bottom of a long page. So the links are always instantly accessible.

This is just a start. I'll probably take this idea further in the future.

If anyone experiences any problems, please report them here and state which browser and version you're using. It won't work on some older browsers, including IE8 and earlier, but the user will still see the old version of the site, so nothing is broken. I'll only use the extra screen space for non-essential things as I don't want to add any new features there that won't be accessible to users with smaller screens.

recorder
Zoom R20
recorder
Boss BR-864
recorder
Ardour
recorder
Audacity
recorder
Bitwig 8-Track
     My Boss BR website

Oldrottenhead

whit goes oan in ma heid



Jemima's
Kite

The
Bunkbeds

Honker

Nevermet

Longhair
Tigers

Oldrottenhead
"In order to compose, all you need to do is remember a tune that nobody else has thought of."
- Robert Schumann

Tony W



recorder
Boss BR-800

recorder
Boss BR-80

recorder
Boss Micro BR

SdC

Doesn't seem to work for me at 1280x800  (FF and IE), but would enjoy that feature if possible.




recorder
Boss BR-600

64Guitars

Quote from: SdC on May 03, 2011, 02:12:33 PMDoesn't seem to work for me at 1280x800  (FF and IE), but would enjoy that feature if possible.

It kicks in at 1320x670. At a width of 1280, there isn't enough room available to display the extra info.

At a later date, I might consider adding just the side menu at screen widths between 1162 and 1319.

recorder
Zoom R20
recorder
Boss BR-864
recorder
Ardour
recorder
Audacity
recorder
Bitwig 8-Track
     My Boss BR website

64Guitars

This feature is possible thanks to CSS3 Media Queries. Here's a chart that shows which browsers support it.

http://caniuse.com/#feat=css-mediaqueries

As you can see, most recent versions of popular browsers support CSS3 Media Queries. However, if you use Internet Explorer, you'll need at least version 9 to take advantage of Songcrafters' new widescreen mode.

recorder
Zoom R20
recorder
Boss BR-864
recorder
Ardour
recorder
Audacity
recorder
Bitwig 8-Track
     My Boss BR website

Tony W

I just had a quirk, but it seems to have gone away. It happened at 4:43 PM EST.

Nevermind the "crappers" tab, its a term of endearment.

People shit out good music like there's no tomorrow.....



recorder
Boss BR-800

recorder
Boss BR-80

recorder
Boss Micro BR

64Guitars

Quote from: 64Guitars on May 03, 2011, 02:23:11 PM
Quote from: SdC on May 03, 2011, 02:12:33 PMDoesn't seem to work for me at 1280x800  (FF and IE), but would enjoy that feature if possible.

It kicks in at 1320x670. At a width of 1280, there isn't enough room available to display the extra info.

At a later date, I might consider adding just the side menu at screen widths between 1162 and 1319.


"A later date" came much earlier than expected.  :)

The side menu should now appear at 1162x670 or larger. But the top banner is unchanged and the side logo panel hidden until the resolution reaches 1320x670 or higher.

recorder
Zoom R20
recorder
Boss BR-864
recorder
Ardour
recorder
Audacity
recorder
Bitwig 8-Track
     My Boss BR website

64Guitars

Quote from: Tony W on May 03, 2011, 02:44:10 PMI just had a quirk, but it seems to have gone away. It happened at 4:43 PM EST.

Yeah, that happened while I was making a small change to allow the side menu to appear at widths between 1162 and 1319. It should be okay now.

recorder
Zoom R20
recorder
Boss BR-864
recorder
Ardour
recorder
Audacity
recorder
Bitwig 8-Track
     My Boss BR website

Bluesberry

This looks fantastic 64G, I really dig it.  Thanks very much for this.

Alternate Tunings: CAUTION: your fingers have to be in different places
 
recorder
Boss Micro BR
recorder
Boss BR-80
recorder
Boss BR-1200
recorder
iPad GarageBand