www.wysiwygwebbuilder.com

Posted: **Sun Oct 11, 2009 3:40 pm**

***Updated 02/01/10***
Meets W3C Standards
Built with Extension Builder 2.0.2

***Update 14/10/09***
Sprite Menu 0.2 Demo
http://justtesting123.comuf.com/sprite/
*****************************************

Sprite Menu 0.2
This is a method of putting together a nice-looking menu in a very quick and easy way. It uses a technique known as CSS Sprites. Instead of trying to manage huge amounts of images, everything is packed into just one file, which means the browser will only have to download one file instead of making multiple requests, and its just a lot easier to manage. The menu is displayed by manipulating the background-position property to display individual sprites in the image.

How to use:
Basically make one large image containing all of the buttons needed for your menu, the normal state along the top, the hover state along the bottom. Also they all need to be the same size for easy use I have supplied a basic selection of menus for you to use you still need to import into a graphics package and add menu names to each button please read the notes in each menu button folder for a simple guide for button sizes: Example name buttons Home, About, Faq etc etc..

As always please read the supplied PDF

Authors Site for Demo:
http://www.distinctcorp.com.au/jquery/spritemenu.html

Download:
http://www.mediafire.com/?rkiyyjvmd5l

Posted: **Sun Oct 11, 2009 11:06 pm**

very very nice extension BaconFries!
simple and simon, but very effective .

.

+tnx for the index update mail.

Posted: **Sun Oct 11, 2009 11:36 pm**

Thx jordan just hope it easily understood that you need to use the menus supplied or user makes own not really all that hard it you have photoshop, fireworks, corel., Gimp to do this....also thx for index update...

Posted: **Sun Oct 11, 2009 11:42 pm**

Nice work Baconfries,I think many users wil use this extension.

Posted: **Sun Oct 11, 2009 11:56 pm**

Thanks Eddy just hope as already mentioned it easy to use with or without "batteries"

Posted: **Mon Oct 12, 2009 12:07 am**

BaconFries wrote:Thx jordan just hope it easily understood that you need to use the menus supplied or user makes own not really all that hard it you have photoshop, fireworks, corel., Gimp to do this....also thx for index update...

nope ...
ones you get the idea of up down state,
it's should be very easy to understand, I think.
the only thing ... you write ie. 109 x 34 (=width x height)
but the extension reads height x width
that confused me at first, but ones I got that out of the way.
smooooth sailing, just by wind no motor or battery needed .

.

Posted: **Mon Oct 12, 2009 6:38 pm**

Evening mywysi ok I have been looking at this and believe I have found the problem with it the script needs the doctype XHTML 1.0 Transitional to work. I have tried it with just HTML 4.01 Transitional and that causes the script to work incorrectly the mouseover effects dont works as they should.
I have tried to use the XHTML 1.0Transitional in WB but the script fails to load and the menus effects dont work....

I have also tried in Extbuilder using XHTML 1.0 Transitional and it works as it should.... Now I dont want to say there might be a bug in WB with the XHTML 1.0 Transitional doctype but if I use the doctype from the extension builder in WB it works correctly I am saying this with a caution as I dont want Pablo to think I am saying there is somthing wrong with WB...
I have also visited the original script to take a look at the doctype used and it is as follows:
Distinctcorp Doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >

Just using this in WB from original site works
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

Extension Builder Doctype works
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

But using the doctype XHTML 1.0 Transitional in WB doesnt Pablo any input on this would be welcome...

Posted: **Tue Oct 13, 2009 12:04 am**

hmmm ... BaconFries this is weird.

with doctype set in WB the output is:
<li><a href="home.html"/></li><li><a href="about.html"/></li>

with doctype set in page html the output is: (correct)
<li><a href="home.html"></a></li><li><a href="about.html"></a></li>

very strange !

!

Posted: **Tue Oct 13, 2009 8:12 am**

Just using this in WB from original site works

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

So far I know in ext builder the xhtml doctype is not "complete" so you can test more different xhtml doctypes.

The doctype xhtml 1.0 in webbuilder is "complete" for transitional.

I think the best is to make a note in your first post that they need to change the doctype for this menu.
XHTML 1.1 is not the same doctype as XHTML 1.0

Posted: **Tue Oct 13, 2009 11:03 am**

New information added to post how to resolve issues with doctype

Posted: **Tue Oct 13, 2009 12:02 pm**

Hello BaconFries,

it's not the doctype that's causing this behavior.
It's Web builder's way of setting the doctype that changes the output.

please try this:
create a sprite menu, one button,
and publish (output) with doctype XHTML 1.0 set in WB.
examine the output file ...
the last line just before the body end, will look like this
<ul id="menu"><li><a href="home.html"/></li></ul></div>

it has changed the code ... !?

Now copy the doctype of that same published (output) file.
and paste it back into your project, into the "page HTML".
set WB's doctype to none, and publish again.
examine the output file ...
the last line just before the body end, will look like this
<ul id="menu"><li><a href="home.html"></a></li></ul></div>

that is the code as it is in your project.

conclusion:
WB is somehow changing the code when XHTML 1.0 is set with WB.

Posted: **Tue Oct 13, 2009 12:15 pm**

Yer I have noticed that too jordan this also happened with another extension I had made Support says it a fault with the script but I dont understand how it changes the script as we both can see depending on if you use HTML 4.0 ot XHTML 1.0 Transitional in WB only pablo can shine a light on this Suppoert/Pablo it over to you with this ...if you need me to send project to you pablo I will do so.
Jordan I am going to make this in WB without a extension just use the raw script from site see what happens will keep ytou imformed one way or another....

Posted: **Tue Oct 13, 2009 12:25 pm**

BaconFries wrote:Yer I have noticed that too jordan this also happened with another extension I had made Support says it a fault with the script but I dont understand how it changes the script as we both can see depending on if you use HTML 4.0 ot XHTML 1.0 Transitional in WB only pablo can shine a light on this Suppoert/Pablo it over to you with this ...if you need me to send project to you pablo I will do so.
Jordan I am going to make this in WB without a extension just use the raw script from site see what happens will keep ytou imformed one way or another....

Good ... !
I already did that, recreate the script (raw) ... same result.
with doctype set in WB it will still change the code .

.

Posted: **Tue Oct 13, 2009 12:40 pm**

Well just need to see what support says.....I may need to remove link for now till I get a reply.
Just to let you know jordan works as it should in the builder so it confusing to why it not working as it should in WB anyway thx mate for you help/info and doing what I was about to do....

Posted: **Tue Oct 13, 2009 12:48 pm**

Insert the slash after the <a/> let me know if the menu than works.

This code is valid xhtml.

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
<title>Untitled Page</title>
<meta name="generator" content="WYSIWYG Web Builder - http://www.wysiwygwebbuilder.com"/>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<ul id="menu"><li><a href="/home.html"/><a/></li></ul>

</body>
</html>

Posted: **Tue Oct 13, 2009 1:15 pm**

Tried this Eddy all it does is give a double menubar on page for original site
<ul id="menu">
<li><a href="/our-team/"></a></li>
<li><a href="/our-profile/"></a></li>
<li><a href="/your-teeth/"></a></li>
<li><a href="/special-occasions/"></a></li>
<li><a href="/your-membership/"></a></li>
<li><a href="/contact-us/"></a></li>
<li><a href="/useful-links/"></a></li>
<li><a href="/book-your-appointment/"></a></li>
</ul>

Posted: **Tue Oct 13, 2009 1:38 pm**

Eureka BaconFries & Eddy!

.
the answer is ... add <> to the code

the code is now
<ul id="menu"><li><a href="#"></a></li></ul>

make the code like this
<ul id="menu"><li><a href="#"><></a></li></ul>

that will make it work!

Posted: **Tue Oct 13, 2009 2:09 pm**

Yer it work but it puts tags over the menu/nav

Posted: **Tue Oct 13, 2009 3:37 pm**

BaconFries wrote:Yer it work but it puts tags over the menu/nav

yes that's coding 101 for ya .

.
you solve one it present another

the answer is this time ... add ... :
<ul id="menu"><li><a href="#">< id="" ></a></li></ul>

BUT if you want to use WB's doctype XHTML 1.0
then you don't need that ... !
cause using WB's doctype setting will not give the <> marks.

so it depends on how you want it to work ...
with Webbuilder setting the doctype ... then <> is enough
with "page HTML" setting the doctype ... then use <id="">

Posted: **Wed Oct 14, 2009 11:07 am**

hi i think it is to do with the size ie the width you have selected in the properties
Very nice extension thanks BaconFries also thanks for the extra button pack will be very useful
regards
Pedro

Posted: **Wed Oct 14, 2009 12:54 pm**

Hi Nicolas_PL
Ok when adding the width and height it is not the overall size of the menu buttons you have made it is the individual size of one button you use... Example you have made a menu and it is lets say Width 548 x Height 67 so this means that one single button will have a width 109 height 33 approx this is the sizes that you use to display also if you use a five button menu then you need to insert five links if you dont and only add four links then only four buttons will be displayed please also note all buttons used must be of the same size or it wont work correctly this in explained in pdf....

Posted: **Thu Oct 22, 2009 5:24 pm**

Fantastic job I look foward to using it

Posted: **Thu Oct 22, 2009 5:50 pm**

Hi morgan as you will read there is a issue with using the doctype XHTML in WB but you can subsitute this with what I have mentioned in first post anything else you know how to get me ...

Posted: **Sat Jan 02, 2010 4:16 pm**

***Updated 02/01/10***

Posted: **Sat Jan 02, 2010 5:01 pm**

Thanks for the update

Posted: **Sat Jan 02, 2010 7:48 pm**

@Baconfries,

You really need to do something at your hosting.(http://justtesting123.comuf.com/sprite/)
Everytime i watch a demo page made by you my security removes a trojan from the system.

Hans

Posted: **Sat Jan 02, 2010 8:02 pm**

No problem for me

Posted: **Tue Dec 27, 2011 7:49 am**

Hi Baconfries,

just tried to download this & page said 'set to private'

I'm not having any luck with downloading extensions today lol!

Posted: **Thu Dec 29, 2011 5:47 pm**

I have set it to PVT for the meantime have had a lot on recently with some health issues...but will try to get this and a few more that are set to PVT updated to the latest builder...holding of on doing this as a Pablo is ment to be releasing a New version in the New Year so i would like to wait and rebuild with this as if I was to rebuild now I would to do it again when the update builder is available...

Posted: **Fri Dec 30, 2011 8:38 am**

Hi Baconfries,

Hey no worries, take your time as it is not a show stopper.

Wish you all the best for the new year, you've helped me a lot in the past & it is appreciated

Posted: **Mon Apr 01, 2013 2:38 am**

Can you please make the download link available?

Posted: **Mon Apr 01, 2013 11:00 am**

Sorry at this time the extension is not avaialble, I may re-release at sometime do definite time, when and if it will only be avaialable from the extension index and for users of WB8.5 and higher only.

Please note that If the extension is shared by others then I do not except any responsibility for the download I also will not offer any assistance with it as is was offered to you rather than myself.

www.wysiwygwebbuilder.com

Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10

www.wysiwygwebbuilder.com

Distinct Corp Sprite Menu 0.2 ***Updated 02/01/10***

Distinct Corp Sprite Menu 0.2 ***Updated 02/01/10***

Re: Distinct Corp Sprite Menu 0.2 ***Updated 02/01/10***

Re: Distinct Corp Sprite Menu 0.2 ***Updated 02/01/10***

Re: Distinct Corp Sprite Menu 0.2 ***Updated 02/01/10***

Re: Distinct Corp Sprite Menu 0.2 ***Updated 02/01/10***

Re: Distinct Corp Sprite Menu 0.2 ***Updated 02/01/10***

Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10

Re: Distinct Corp Sprite Menu 0.2 Updated 02/01/10