Fwd: [WSG] Horizontal Menu Bar Help Needed
Agree with John. Thanks to John for such as wonderful and crisp reply. I too have implemented menus always as 1. Unordered list(html element ul ) 2. Each item as list items (li) and anchors ( a ) 3. Css styled them and added behavior using jquery and modifying the css dynamically on user interaction.. Emily there are a lot of free menu examples/samples with source on web and you can use them to build your menus. However I saw your site, and it shows the intended behavior on mouseovers and clicks. I guess you solved the problem. :) I am using chrome. On Tue, Mar 29, 2011 at 10:09 AM, John Unsworth john.unswo...@gmail.comwrote: Hi Emily, Firstly the problem you describe might be your browser. I'm using Safari on a Mac and the desired effect appears to occur, whether I use the back button or click Home again. So this might be the reason your not getting the expected effect. Secondly, the standards group I would imagine are collectively having kittens seeing all that table based layout rendered by Dreamweaver. Whilst there is often some debate, on the whole most people employ a list for navigation rather than a table, however I'm assuming the whole page is a table layout and thus whilst I would encourage you to reconsider, I'm not going to go into an entire rewrite. I would then suggest to you it's time to learn some CSS. Your Dreamweaver behaviours are embedded Javascript(s), added to which all your presentation information, such as width and height are inline to boot. What you want to strive for is plain simple HTML, with externally linked CSS and JS files. This approach is sometimes referred to as 'three layers'. That being Content (HTML), Presentation (CSS) and finally Behaviours (Javascript). Presuming this is not just a practice piece of work and the error your getting is just within your browser, I don't think there is a simple bit of 'code' that will fix this. Moving forward I can only suggest you change your methods in line with the sentiments of the standards group. Personally if your starting out I can't recommend Ian Lloyd's 'Build your website the right way, using HTML and CSS' from Sitepoint, and 'HTML Dog, The best-practice guide to XHTML CSS' by Patrick Griffiths enough. All the best, John Unsworth *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Horizontal Menu Bar Help Needed
On 29/03/11 05:39, John Unsworth wrote: Hi Emily, Firstly the problem you describe might be your browser. I'm using Safari on a Mac and the desired effect appears to occur, whether I use the back button or click Home again. So this might be the reason your not getting the expected effect. [snipped] Your Dreamweaver behaviours are embedded Javascript(s), ... All the best, John Unsworth I use Firefox on Linux, with javascript disabled by default. That shows a yellow background for the current page, and no hover behaviour - fine. If I enable javascript, the yellow background appears on hover, and disappears from the current page as long as I continue the hover, which seems to be the expected behaviour. If I use the mouse to visit another page, everything behaves as expected, but if I use the browser back button, I get the effect Emily describes - the yellow background stays on the previous link and only changes when the menu is hovered over. The same problem occurs in Epiphany (Webkit-based) but not in Chromium. Unfortunately, I don't know enough about Dreamweaver or javascript to help here, but I'm posting this in the hope that it might assist someone who does. Emily - you might also want to try the webdesign-l list http://webdesign-L.com/ for help. It deals with all aspects of Web design, not just standards-related. HTH Lesley -- Life is not a malfunction (Short Circuit) *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Horizontal Menu Bar Help Needed
Dear John Unsworth, Your kindness and humorous reference to collectively having kittens brightened my otherwise challenging day. I agree with you 100% this site needs a complete CSS upgrade however, for reasons to lengthy to explain here, it's been insisted that I only change the look and feel of the site with minor functionality changes but not the tables structure of the site. I am in the process of learning CSS in preparation for the glorious day I am given the go ahead to upgrade the site. Since my previous email, I have found this website: http://www.sohtanaka.com/web-design/active-state-in-css-navigations/ which seems to have a solution for the navigation I will try to implement. I appreciate the book references you supplied which I will add to my learning materials. Thank you for your reply and help with my challenge. Smiles, Emily Date: Tue, 29 Mar 2011 15:39:46 +1100 Subject: Re: [WSG] Horizontal Menu Bar Help Needed From: john.unswo...@gmail.com To: wsg@webstandardsgroup.org Hi Emily, Firstly the problem you describe might be your browser. I'm using Safari on a Mac and the desired effect appears to occur, whether I use the back button or click Home again. So this might be the reason your not getting the expected effect. Secondly, the standards group I would imagine are collectively having kittens seeing all that table based layout rendered by Dreamweaver. Whilst there is often some debate, on the whole most people employ a list for navigation rather than a table, however I'm assuming the whole page is a table layout and thus whilst I would encourage you to reconsider, I'm not going to go into an entire rewrite. I would then suggest to you it's time to learn some CSS. Your Dreamweaver behaviours are embedded Javascript(s), added to which all your presentation information, such as width and height are inline to boot. What you want to strive for is plain simple HTML, with externally linked CSS and JS files. This approach is sometimes referred to as 'three layers'. That being Content (HTML), Presentation (CSS) and finally Behaviours (Javascript). Presuming this is not just a practice piece of work and the error your getting is just within your browser, I don't think there is a simple bit of 'code' that will fix this. Moving forward I can only suggest you change your methods in line with the sentiments of the standards group. Personally if your starting out I can't recommend Ian Lloyd's 'Build your website the right way, using HTML and CSS' from Sitepoint, and 'HTML Dog, The best-practice guide to XHTML CSS' by Patrick Griffiths enough. All the best, John Unsworth *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Horizontal Menu Bar Help Needed
Hello Jiten, I agree with John and you too! Please see my reply to John. Thank you for your reply. :-) Smiles, Emily Date: Tue, 29 Mar 2011 16:30:16 +0530 Subject: Fwd: [WSG] Horizontal Menu Bar Help Needed From: ji...@automateonweb.com To: wsg@webstandardsgroup.org CC: john.unswo...@gmail.com Agree with John. Thanks to John for such as wonderful and crisp reply.I too have implemented menus always as 1. Unordered list(html element ul ) 2. Each item as list items (li) and anchors ( a ) 3. Css styled them and added behavior using jquery and modifying the css dynamically on user interaction.. Emily there are a lot of free menu examples/samples with source on web and you can use them to build your menus. However I saw your site, and it shows the intended behavior on mouseovers and clicks. I guess you solved the problem. :) I am using chrome. On Tue, Mar 29, 2011 at 10:09 AM, John Unsworth john.unswo...@gmail.com wrote: Hi Emily, Firstly the problem you describe might be your browser. I'm using Safari on a Mac and the desired effect appears to occur, whether I use the back button or click Home again. So this might be the reason your not getting the expected effect. Secondly, the standards group I would imagine are collectively having kittens seeing all that table based layout rendered by Dreamweaver. Whilst there is often some debate, on the whole most people employ a list for navigation rather than a table, however I'm assuming the whole page is a table layout and thus whilst I would encourage you to reconsider, I'm not going to go into an entire rewrite. I would then suggest to you it's time to learn some CSS. Your Dreamweaver behaviours are embedded Javascript(s), added to which all your presentation information, such as width and height are inline to boot. What you want to strive for is plain simple HTML, with externally linked CSS and JS files. This approach is sometimes referred to as 'three layers'. That being Content (HTML), Presentation (CSS) and finally Behaviours (Javascript). Presuming this is not just a practice piece of work and the error your getting is just within your browser, I don't think there is a simple bit of 'code' that will fix this. Moving forward I can only suggest you change your methods in line with the sentiments of the standards group. Personally if your starting out I can't recommend Ian Lloyd's 'Build your website the right way, using HTML and CSS' from Sitepoint, and 'HTML Dog, The best-practice guide to XHTML CSS' by Patrick Griffiths enough. All the best, John Unsworth *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Horizontal Menu Bar Help Needed
Hello Lesley, Thank you for your reply as well. I will check into http://webdesign-L.com/. Smiles, Emily Date: Tue, 29 Mar 2011 13:08:00 +0100 From: ubu...@webaflame.co.uk To: wsg@webstandardsgroup.org Subject: Re: [WSG] Horizontal Menu Bar Help Needed On 29/03/11 05:39, John Unsworth wrote: Hi Emily, Firstly the problem you describe might be your browser. I'm using Safari on a Mac and the desired effect appears to occur, whether I use the back button or click Home again. So this might be the reason your not getting the expected effect. [snipped] Your Dreamweaver behaviours are embedded Javascript(s), ... All the best, John Unsworth I use Firefox on Linux, with javascript disabled by default. That shows a yellow background for the current page, and no hover behaviour - fine. If I enable javascript, the yellow background appears on hover, and disappears from the current page as long as I continue the hover, which seems to be the expected behaviour. If I use the mouse to visit another page, everything behaves as expected, but if I use the browser back button, I get the effect Emily describes - the yellow background stays on the previous link and only changes when the menu is hovered over. The same problem occurs in Epiphany (Webkit-based) but not in Chromium. Unfortunately, I don't know enough about Dreamweaver or javascript to help here, but I'm posting this in the hope that it might assist someone who does. Emily - you might also want to try the webdesign-l list http://webdesign-L.com/ for help. It deals with all aspects of Web design, not just standards-related. HTH Lesley -- Life is not a malfunction (Short Circuit) *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Horizontal Menu Bar Help Needed
Hi Emily, Create your links as in an unordered list as below. Style the elements using css. To show which page a user is on, simply create a class and apply the class to the relevant anchor element; like below... div id=nav ul lia href=index.php title= class=hereHome/a/li lia href=products.php title=Products/a lia href=gallery.php title=Gallery/a/li lia href=paymentMethods.php title=Payment Methods/a/li lia href=about.php title=About Us/a/li lia href=contact.php title=Contact Us/a/li /ul #nav a.here { color: #000; } Hope this is clear for you... regards Stephen Hamill On 29/03/2011 17:20, E W wrote: Dear John Unsworth, Your kindness and humorous reference to collectively having kittens brightened my otherwise challenging day. I agree with you 100% this site needs a complete CSS upgrade however, for reasons to lengthy to explain here, it's been insisted that I only change the look and feel of the site with minor functionality changes but not the tables structure of the site. I am in the process of learning CSS in preparation for the glorious day I am given the go ahead to upgrade the site. Since my previous email, I have found this website: http://www.sohtanaka.com/web-design/active-state-in-css-navigations/ which seems to have a solution for the navigation I will try to implement. I appreciate the book references you supplied which I will add to my learning materials. Thank you for your reply and help with my challenge. Smiles, Emily Date: Tue, 29 Mar 2011 15:39:46 +1100 Subject: Re: [WSG] Horizontal Menu Bar Help Needed From: john.unswo...@gmail.com To: wsg@webstandardsgroup.org Hi Emily, Firstly the problem you describe might be your browser. I'm using Safari on a Mac and the desired effect appears to occur, whether I use the back button or click Home again. So this might be the reason your not getting the expected effect. Secondly, the standards group I would imagine are collectively having kittens seeing all that table based layout rendered by Dreamweaver. Whilst there is often some debate, on the whole most people employ a list for navigation rather than a table, however I'm assuming the whole page is a table layout and thus whilst I would encourage you to reconsider, I'm not going to go into an entire rewrite. I would then suggest to you it's time to learn some CSS. Your Dreamweaver behaviours are embedded Javascript(s), added to which all your presentation information, such as width and height are inline to boot. What you want to strive for is plain simple HTML, with externally linked CSS and JS files. This approach is sometimes referred to as 'three layers'. That being Content (HTML), Presentation (CSS) and finally Behaviours (Javascript). Presuming this is not just a practice piece of work and the error your getting is just within your browser, I don't think there is a simple bit of 'code' that will fix this. Moving forward I can only suggest you change your methods in line with the sentiments of the standards group. Personally if your starting out I can't recommend Ian Lloyd's 'Build your website the right way, using HTML and CSS' from Sitepoint, and 'HTML Dog, The best-practice guide to XHTML CSS' by Patrick Griffiths enough. All the best, John Unsworth *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Horizontal Menu Bar Help Needed
hello , my good friend , our is china wholesale brand shoes . pls chack our site in fo : www.west-trading.com thanks xiong Date: Tue, 29 Mar 2011 17:36:59 +0100 From: ste.ham...@sunraymedia.co.uk To: wsg@webstandardsgroup.org Subject: Re: [WSG] Horizontal Menu Bar Help Needed Hi Emily, Create your links as in an unordered list as below. Style the elements using css. To show which page a user is on, simply create a class and apply the class to the relevant anchor element; like below... div id=nav ul lia href=index.php title= class=hereHome/a/li lia href=products.php title=Products/a lia href=gallery.php title=Gallery/a/li lia href=paymentMethods.php title=Payment Methods/a/li lia href=about.php title=About Us/a/li lia href=contact.php title=Contact Us/a/li /ul #nav a.here { color: #000; } Hope this is clear for you... regards Stephen Hamill On 29/03/2011 17:20, E W wrote: Dear John Unsworth, Your kindness and humorous reference to collectively having kittens brightened my otherwise challenging day. I agree with you 100% this site needs a complete CSS upgrade however, for reasons to lengthy to explain here, it's been insisted that I only change the look and feel of the site with minor functionality changes but not the tables structure of the site. I am in the process of learning CSS in preparation for the glorious day I am given the go ahead to upgrade the site. Since my previous email, I have found this website: http://www.sohtanaka.com/web-design/active-state-in-css-navigations/ which seems to have a solution for the navigation I will try to implement. I appreciate the book references you supplied which I will add to my learning materials. Thank you for your reply and help with my challenge. Smiles, Emily Date: Tue, 29 Mar 2011 15:39:46 +1100 Subject: Re: [WSG] Horizontal Menu Bar Help Needed From: john.unswo...@gmail.com To: wsg@webstandardsgroup.org Hi Emily, Firstly the problem you describe might be your browser. I'm using Safari on a Mac and the desired effect appears to occur, whether I use the back button or click Home again. So this might be the reason your not getting the expected effect. Secondly, the standards group I would imagine are collectively having kittens seeing all that table based layout rendered by Dreamweaver. Whilst there is often some debate, on the whole most people employ a list for navigation rather than a table, however I'm assuming the whole page is a table layout and thus whilst I would encourage you to reconsider, I'm not going to go into an entire rewrite. I would then suggest to you it's time to learn some CSS. Your Dreamweaver behaviours are embedded Javascript(s), added to which all your presentation information, such as width and height are inline to boot. What you want to strive for is plain simple HTML, with externally linked CSS and JS files. This approach is sometimes referred to as 'three layers'. That being Content (HTML), Presentation (CSS) and finally Behaviours (Javascript). Presuming this is not just a practice piece of work and the error your getting is just within your browser, I don't think there is a simple bit of 'code' that will fix this. Moving forward I can only suggest you change your methods in line with the sentiments of the standards group. Personally if your starting out I can't recommend Ian Lloyd's 'Build your website the right way, using HTML and CSS' from Sitepoint, and 'HTML Dog, The best-practice guide to XHTML CSS' by Patrick Griffiths enough. All the best, John Unsworth *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org
Re: [WSG] Horizontal Menu Bar Help Needed
Our good friend Xiong is no longer with us (on the mailing list at least) As you were... Russ On 30/03/2011, at 3:47 AM, huangmei mei wrote: hello , my good friend , our is china wholesale brand shoes . pls chack our site in fo : www.west-trading.com thanks xiong *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Horizontal Menu Bar Help Needed
Thank you Russ! Subject: Re: [WSG] Horizontal Menu Bar Help Needed From: r...@maxdesign.com.au Date: Wed, 30 Mar 2011 07:14:00 +1100 To: wsg@webstandardsgroup.org Our good friend Xiong is no longer with us (on the mailing list at least) As you were... Russ On 30/03/2011, at 3:47 AM, huangmei mei wrote: hello , my good friend , our is china wholesale brand shoes . pls chack our site in fo : www.west-trading.com thanks xiong *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Horizontal Menu Bar Help Needed
Hello Stephen, Thank you very much for the code. :-) Smiles, Emily Date: Tue, 29 Mar 2011 17:36:59 +0100 From: ste.ham...@sunraymedia.co.uk To: wsg@webstandardsgroup.org Subject: Re: [WSG] Horizontal Menu Bar Help Needed Message body Hi Emily, Create your links as in an unordered list as below. Style the elements using css. To show which page a user is on, simply create a class and apply the class to the relevant anchor element; like below... div id=nav ul lia href=index.php title= class=hereHome/a/li lia href=products.php title=Products/a lia href=gallery.php title=Gallery/a/li lia href=paymentMethods.php title=Payment Methods/a/li lia href=about.php title=About Us/a/li lia href=contact.php title=Contact Us/a/li /ul #nav a.here { color: #000; } Hope this is clear for you... regards Stephen Hamill On 29/03/2011 17:20, E W wrote: Dear John Unsworth, Your kindness and humorous reference to collectively having kittens brightened my otherwise challenging day. I agree with you 100% this site needs a complete CSS upgrade however, for reasons to lengthy to explain here, it's been insisted that I only change the look and feel of the site with minor functionality changes but not the tables structure of the site. I am in the process of learning CSS in preparation for the glorious day I am given the go ahead to upgrade the site. Since my previous email, I have found this website: http://www.sohtanaka.com/web-design/active-state-in-css-navigations/ which seems to have a solution for the navigation I will try to implement. I appreciate the book references you supplied which I will add to my learning materials. Thank you for your reply and help with my challenge. Smiles, Emily Date: Tue, 29 Mar 2011 15:39:46 +1100 Subject: Re: [WSG] Horizontal Menu Bar Help Needed From: john.unswo...@gmail.com To: wsg@webstandardsgroup.org Hi Emily, Firstly the problem you describe might be your browser. I'm using Safari on a Mac and the desired effect appears to occur, whether I use the back button or click Home again. So this might be the reason your not getting the expected effect. Secondly, the standards group I would imagine are collectively having kittens seeing all that table based layout rendered by Dreamweaver. Whilst there is often some debate, on the whole most people employ a list for navigation rather than a table, however I'm assuming the whole page is a table layout and thus whilst I would encourage you to reconsider, I'm not going to go into an entire rewrite. I would then suggest to you it's time to learn some CSS. Your Dreamweaver behaviours are embedded Javascript(s), added to which all your presentation information, such as width and height are inline to boot. What you want to strive for is plain simple HTML, with externally linked CSS and JS files. This approach is sometimes referred to as 'three layers'. That being Content (HTML), Presentation (CSS) and finally Behaviours (Javascript). Presuming this is not just a practice piece of work and the error your getting is just within your browser, I don't think there is a simple bit of 'code' that will fix this. Moving forward I can only suggest you change your methods in line with the sentiments of the standards group. Personally if your starting out I can't recommend Ian Lloyd's 'Build your website the right way, using HTML and CSS' from Sitepoint, and 'HTML Dog, The best-practice guide to XHTML CSS' by Patrick Griffiths enough. All the best, John Unsworth *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: