Hi, Karl... I figured you just got busy or perhaps just didn't feel you had more time to devote to the project.
We're so close! Just a couple of little "performance issues" to work out. I have been looking at Klaus' UI/Tabs plug-in, too, and think it has great potential if we need to change approaches. I'm sorry to hear that our daughter had to have a tonsillectomy. I hope she's recovering well. I'm sure she's enjoying lots of ice cream! :o) I don't use IM much...it's been awhile, but I have an account that uses Windows Messenger. Is that suitable for you? Rick > -----Original Message----- > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Karl > Swedberg > Sent: Sunday, January 20, 2008 12:38 AM > To: jquery-en@googlegroups.com > Subject: [jQuery] Re: Still working out "drop-down div menu"... > > > Hi Rick, > > Sorry for not getting back to you sooner. I sort of lost track of the > thread and have been busy with a couple freelance projects, my day > job, and my daughter recovering from a tonsillectomy. > > Anyway, it seems like this conversation has moved away from general > interest, so perhaps we should continue off-list. I'll try to respond > to your questions below tomorrow. If you use IM, send me your info and > I'll ping you sometime tomorrow. > > > --Karl > _________________ > Karl Swedberg > www.englishrules.com > www.learningjquery.com > > > > On Jan 19, 2008, at 11:01 AM, Rick Faircloth wrote: > > > > > Hi, Karl... > > > > Have we stalled out on this project? I've been concerned about > > asking too much of you. If you want to transition this to a paid > > project, > > just let me know! > > > > Rick > > > >> -----Original Message----- > >> From: jquery-en@googlegroups.com [mailto:jquery- > >> [EMAIL PROTECTED] On Behalf Of Rick > >> Faircloth > >> Sent: Thursday, January 17, 2008 12:05 PM > >> To: jquery-en@googlegroups.com > >> Subject: [jQuery] Re: Still working out "drop-down div menu"... > >> > >> > >> Well... my attempts to fix the details div showing with content > >> didn't work. At least I think I changed all the padding and line- > >> heights > >> that I attempted to change back to the way they were. However, now > >> the > >> issue seems to have "disappeared"! Whatever... as long as it works! > >> > >> The last issue I see now is that *sometimes* when I move the mouse > >> between > >> menu items, especially the home and buyers menu items, the details- > >> div slides up > >> and the details content remains on the screen. It's not always > >> that way, but it > >> does happen in both IE and FF. Any ideas on that? > >> > >> From what I can tell, you've taken the route of separating the > >> actual div with the > >> details from the div that slides down. Is that part of what > >> complicates the > >> synchronization of the "display div" and the "content" or "details" > >> div? > >> > >> Would it be simpler to actually put the details *inside* the > >> display div to > >> eliminate the possibility of details being left on the screen > >> without the background div? > >> > >> It would seem that placing the details actually in the display div > >> would tied them > >> together so that if the display div is visible, the details must > >> be, too, and vice versa. > >> > >> And, this is just minor at this point, the details would actually > >> be sliding up and down > >> with the display div. > >> > >> Looks like this may be a "two-wish-list-gift" assistance! :o) > >> > >> Thanks, > >> > >> Rick > >> > >>> -----Original Message----- > >>> From: jquery-en@googlegroups.com [mailto:jquery- > >>> [EMAIL PROTECTED] On Behalf Of Rick > >>> Faircloth > >>> Sent: Thursday, January 17, 2008 11:17 AM > >>> To: jquery-en@googlegroups.com > >>> Subject: [jQuery] Re: Still working out "drop-down div menu"... > >>> > >>> > >>> Ok... thanks, Karl. It seems to be working better. > >>> I'm going to make a change in the padding of the ul, #id="ul-index" > >>> because the bottom of the li's contained therein aren't currently > >>> reaching as far down as the #menu-index... there's a gap of about > >>> 6px at the bottom which allows the details div to expend without > >>> showing the menu content. > >>> > >>> My initial results show this solution will work. I'll make you mods > >>> first, then mine, then test on IE6, IE7, and FF2 (Windows All) and > >>> report back. > >>> > >>> Thanks, again for all the work! > >>> > >>> Rick > >>> > >>>> -----Original Message----- > >>>> From: jquery-en@googlegroups.com [mailto:jquery- > >>>> [EMAIL PROTECTED] On Behalf Of Karl > >>>> Swedberg > >>>> Sent: Thursday, January 17, 2008 10:28 AM > >>>> To: jquery-en@googlegroups.com > >>>> Subject: [jQuery] Re: Still working out "drop-down div menu"... > >>>> > >>>> > >>>> Hi Rick, > >>>> > >>>> After several failed attempts, I think I have this working for > >>>> you. I > >>>> had to set a flag for the menu-details div's visibility (I called > >>>> it > >>>> "bVis"). It's initially set to false. In the mouseover argument > >>>> of $ > >>>> ('#menu-index').hover(...), it gets set to true in the callback > >>>> of $ > >>>> ('div.menu-details').slideDown(). It thengets reset to false on > >>>> mouseout. > >>>> > >>>> Then for the mouseover argument of ... .find('li').hover(), it > >>>> does a > >>>> slide down of the corresponding div if bVis is false and a > >>>> simple .show() if it's true. Worked in my limited testing with FF > >>>> 2 Mac. > >>>> > >>>> http://test.learningjquery.com/c21.html > >>>> > >>>> --Karl > >>>> _________________ > >>>> Karl Swedberg > >>>> www.englishrules.com > >>>> www.learningjquery.com > >>>> > >>>> > >>>> > >>>> On Jan 16, 2008, at 9:42 PM, Rick Faircloth wrote: > >>>> > >>>>> > >>>>> Thanks, Karl! > >>>>> > >>>>> This is a chance, too, for me to find out what the > >>>>> "expander" plug-in is! Haven't heard of that one, yet... > >>>>> > >>>>> Rick > >>>>> > >>>>>> -----Original Message----- > >>>>>> From: jquery-en@googlegroups.com [mailto:jquery- > >>>>>> [EMAIL PROTECTED] On Behalf Of Karl > >>>>>> Swedberg > >>>>>> Sent: Wednesday, January 16, 2008 8:46 PM > >>>>>> To: jquery-en@googlegroups.com > >>>>>> Subject: [jQuery] Re: Still working out "drop-down div menu"... > >>>>>> > >>>>>> > >>>>>> Hey Rick, > >>>>>> > >>>>>> Glad to hear that you're making progress! I'll take a look at the > >>>>>> page > >>>>>> again tonight and offer a suggestion (and possibly a demo) for > >>>>>> getting > >>>>>> the content to slide down with that details div. > >>>>>> > >>>>>> Only because you asked ... you can find a link to my amazon.com > >>>>>> wish > >>>>>> list on my Expander plugin page: > >>>>>> > >>>>>> http://plugins.learningjquery.com/expander/ > >>>>>> > >>>>>> (wow, I just shamelessly promoted my plugin AND publicly > >>>>>> announced > >>>>>> where my wish list could be found. Brazen!) > >>>>>> > >>>>>> > >>>>>> --Karl > >>>>>> _________________ > >>>>>> Karl Swedberg > >>>>>> www.englishrules.com > >>>>>> www.learningjquery.com > >>>>>> > >>>>>> > >>>>>> > >>>>>> On Jan 16, 2008, at 7:56 PM, Rick Faircloth wrote: > >>>>>> > >>>>>>> > >>>>>>> I got the changes implemented that you made, Karl > >>>>>>> and things are working very well! I've still got to > >>>>>>> study just what you did to see if I understand it. > >>>>>>> > >>>>>>> About the last issue I'm facing is how the details div > >>>>>>> and content for that div is displaying. > >>>>>>> > >>>>>>> If you'll go to http://c21ar.wsm-dev.com and mouse over > >>>>>>> the "Buyers" menu link, you'll see what I'm talking about. > >>>>>>> > >>>>>>> The div slides in perfectly, but the content, actually being > >>>>>>> outside the div (I've got to check that...) is being displayed > >>>>>>> before the div completely drops down. > >>>>>>> > >>>>>>> Ideally, the content would drop down with the div. Any way to > >>>>>>> modify things so the content slides down with the div? I will > >>>>>>> look at the code, but without understanding how it's all > >>>>>>> working, > >>>>>>> I'm afraid to make many changes. > >>>>>>> > >>>>>>> Any ideas? > >>>>>>> > >>>>>>> I really appreciate your help! > >>>>>>> > >>>>>>> Rick > >>>>>>> > >>>>>>> PS - And I'm still looking for that wish list! You've gone > >>>>>>> "above and beyond" helping on this project with the coding and > >>>>>>> rebuilding the site demoing your changes and I want to show > >>>>>>> my appreciation! :o) Got a wish list on Amazon? > >>>>>>> > >>>>>>> > >>>>>>> > >>>>>>>> -----Original Message----- > >>>>>>>> From: jquery-en@googlegroups.com [mailto:jquery- > >>>>>>>> [EMAIL PROTECTED] On Behalf Of Rick > >>>>>>>> Faircloth > >>>>>>>> Sent: Wednesday, January 16, 2008 3:53 PM > >>>>>>>> To: jquery-en@googlegroups.com > >>>>>>>> Subject: [jQuery] Re: Still working out "drop-down div menu"... > >>>>>>>> > >>>>>>>> > >>>>>>>> That looks great, Karl! > >>>>>>>> > >>>>>>>> And I see the changing content, also! > >>>>>>>> > >>>>>>>> Where's your wish list? :o) > >>>>>>>> > >>>>>>>> Rick > >>>>>>>> > >>>>>>>>> -----Original Message----- > >>>>>>>>> From: jquery-en@googlegroups.com [mailto:jquery- > >>>>>>>>> [EMAIL PROTECTED] On Behalf Of Karl > >>>>>>>>> Swedberg > >>>>>>>>> Sent: Wednesday, January 16, 2008 3:18 PM > >>>>>>>>> To: jquery-en@googlegroups.com > >>>>>>>>> Subject: [jQuery] Re: Still working out "drop-down div > >>>>>>>>> menu"... > >>>>>>>>> > >>>>>>>>> > >>>>>>>>> > >>>>>>>>> On Jan 16, 2008, at 7:21 AM, Rick Faircloth wrote: > >>>>>>>>>> > >>>>>>>>>> @Karl: > >>>>>>>>>> > >>>>>>>>>> Hi, Karl... and thanks for the reply! > >>>>>>>>>> > >>>>>>>>>> I appreciate the work you did on the site. > >>>>>>>>>> > >>>>>>>>>> The problem I noticed right away is that when the > >>>>>>>>>> link is moused-off, then the corresponding details div > >>>>>>>>>> slides up. > >>>>>>>>>> The details for each menu link will need to stay down until a > >>>>>>>>>> user > >>>>>>>>>> mouses over it and then back off or until the user moves > >>>>>>>>>> horizontally > >>>>>>>>>> to a new menu link. The details div is not just for > >>>>>>>>>> information, > >>>>>>>>>> but > >>>>>>>>>> will contain more links for users to click. > >>>>>>>>> > >>>>>>>>> Hey Rick, > >>>>>>>>> > >>>>>>>>> No problem. > >>>>>>>>> > >>>>>>>>> Let me guess: you're using Internet Explorer, right? ;-) > >>>>>>>>> > >>>>>>>>> It was working fine for me in FF, but because of a minute > >>>>>>>>> difference > >>>>>>>>> in where the browsers were positioning the top of each li's > >>>>>>>>> div, > >>>>>>>>> and > >>>>>>>>> because of a weird z-index issue in IE, it was borking in IE. > >>>>>>>>> > >>>>>>>>> Take a look again. It should be working fine now. You'll > >>>>>>>>> want to > >>>>>>>>> grab > >>>>>>>>> the style rule out of the <head> and put it in c21ar-ie7.css > >>>>>>>>> and > >>>>>>>>> c21ar- > >>>>>>>>> ie6.css instead: > >>>>>>>>> #image-wrapper { > >>>>>>>>> z-index: -1; > >>>>>>>>> } > >>>>>>>>> > >>>>>>>>> Again, you can see the test page here: > >>>>>>>>> http://test.learningjquery.com/c21.html > >>>>>>>>> > >>>>>>>>> > >>>>>>>>> --Karl > >>>>>>>>> _________________ > >>>>>>>>> Karl Swedberg > >>>>>>>>> www.englishrules.com > >>>>>>>>> www.learningjquery.com > >>>>>>>>> > >>>>>>>>> > >>>>>>>>> > >>>>>>>>>> > >>>>>>>>>> Hamish attempted to overcome that problem, but with his > >>>>>>>>>> version, > >>>>>>>>>> if a > >>>>>>>>>> user moves across the menu horizontally, then the details div > >>>>>>>>>> that > >>>>>>>>>> is on display does slide up when a new one appears, so they > >>>>>>>>>> just > >>>>>>>>>> stack up. > >>>>>>>>>> > >>>>>>>>>> btw, generating the details div with jQuery was a nice touch. > >>>>>>>>>> Once > >>>>>>>>>> I get > >>>>>>>>>> past the operational problems of the setup, I'll have to see > >>>>>>>>>> about how > >>>>>>>>>> to get the content into each div. Perhaps some sort of > >>>>>>>>>> "include" > >>>>>>>>>> inside > >>>>>>>>>> each div that pulls in external HTML content. > >>>>>>>>>> > >>>>>>>>>> Any ideas on how to keep that menu div open if a user is > >>>>>>>>>> mousing > >>>>>>>>>> over it, > >>>>>>>>>> letting it slide up if a user mouses off of it or letting it > >>>>>>>>>> slide up > >>>>>>>>>> if the user mouses over link horizontally without mousing > >>>>>>>>>> over > >>>>>>>>>> the > >>>>>>>>>> details div? > >>>>>>>>>> > >>>>>>>>>> @Hamish > >>>>>>>>>> > >>>>>>>>>> Thanks for the reply and the code, Hamish! > >>>>>>>>>> > >>>>>>>>>> You can see from my remarks to Karl above, that while your > >>>>>>>>>> version > >>>>>>>>>> of the > >>>>>>>>>> code does keep the details div open until a user mouses off > >>>>>>>>>> of > >>>>>>>>>> it, > >>>>>>>>>> it also > >>>>>>>>>> allows a details div to stay open when a user mouses over the > >>>>>>>>>> menu > >>>>>>>>>> links > >>>>>>>>>> horizontally. > >>>>>>>>>> > >>>>>>>>>> There's no trigger to cause the div to slide back up if the > >>>>>>>>>> user > >>>>>>>>>> never > >>>>>>>>>> mouses over the details div. > >>>>>>>>>> > >>>>>>>>>> Any ideas? > >>>>>>>>>> > >>>>>>>>>> Rick > >>>>>>>>>> > >>>>>>>>>> > >>>>>>>>>> > >>>>>>>>>>> -----Original Message----- > >>>>>>>>>>> From: jquery-en@googlegroups.com [mailto:jquery- > >>>>>>>>>>> [EMAIL PROTECTED] On Behalf Of Karl > >>>>>>>>>>> Swedberg > >>>>>>>>>>> Sent: Wednesday, January 16, 2008 12:52 AM > >>>>>>>>>>> To: jquery-en@googlegroups.com > >>>>>>>>>>> Subject: [jQuery] Re: Still working out "drop-down div > >>>>>>>>>>> menu"... > >>>>>>>>>>> > >>>>>>>>>>> > >>>>>>>>>>> Hey Rick, > >>>>>>>>>>> > >>>>>>>>>>> I did a little overhaul on your page and got something > >>>>>>>>>>> working. > >>>>>>>>>>> Changed a bit of HTML and CSS along with the jQuery code. > >>>>>>>>>>> CSS > >>>>>>>>>>> could > >>>>>>>>>>> use some tweaking still, probably increase the top and > >>>>>>>>>>> bottom > >>>>>>>>>>> padding > >>>>>>>>>>> on the links (and then you might have to adjust the top of > >>>>>>>>>>> div > >>>>>>>>>>> class="menu-details" > >>>>>>>>>>> > >>>>>>>>>>> By putting the divs inside each li, it made it a lot > >>>>>>>>>>> easier to > >>>>>>>>>>> get > >>>>>>>>>>> each one to show when it should. Since the menu-details > >>>>>>>>>>> div is > >>>>>>>>>>> now in > >>>>>>>>>>> the page only for the visual effect, I pulled it out of > >>>>>>>>>>> the HTML > >>>>>>>>>>> and > >>>>>>>>>>> created it via jQuery. > >>>>>>>>>>> > >>>>>>>>>>> Here is the code: > >>>>>>>>>>> > >>>>>>>>>>> $(document).ready(function() { > >>>>>>>>>>> $('<div class="menu-details"></div>').appendTo('#image- > >>>>>>>>>>> wrapper') > >>>>>>>>>>> .add('#ul-index div').hide(); > >>>>>>>>>>> > >>>>>>>>>>> $('#menu-index').hover(function() { > >>>>>>>>>>> $('div.menu-details').slideDown(); > >>>>>>>>>>> }, function() { > >>>>>>>>>>> $('div.menu-details').slideUp(); > >>>>>>>>>>> }) > >>>>>>>>>>> .find('li').hover(function() { > >>>>>>>>>>> $(this).find('div').show(); > >>>>>>>>>>> }, function() { > >>>>>>>>>>> $('div', this).hide(); > >>>>>>>>>>> }); > >>>>>>>>>>> }); > >>>>>>>>>>> > >>>>>>>>>>> And here is the page: > >>>>>>>>>>> > >>>>>>>>>>> http://test.learningjquery.com/c21.html > >>>>>>>>>>> > >>>>>>>>>>> > >>>>>>>>>>> --Karl > >>>>>>>>>>> _________________ > >>>>>>>>>>> Karl Swedberg > >>>>>>>>>>> www.englishrules.com > >>>>>>>>>>> www.learningjquery.com > >>>>>>>>>>> > >>>>>>>>>>> > >>>>>>>>>>> > >>>>>>>>>>> On Jan 15, 2008, at 10:46 PM, Rick Faircloth wrote: > >>>>>>>>>>> > >>>>>>>>>>>> > >>>>>>>>>>>> Hi, all. > >>>>>>>>>>>> > >>>>>>>>>>>> I'm still trying to work out a drop-down div > >>>>>>>>>>>> for my horizontal menu. > >>>>>>>>>>>> > >>>>>>>>>>>> I've tried various approaches and the closest I've > >>>>>>>>>>>> been able to come to the proper animation so far > >>>>>>>>>>>> (which still isn't correct) is with this code > >>>>>>>>>>>> (written in long-form for now and just > >>>>>>>>>>>> for the first two menu items): > >>>>>>>>>>>> > >>>>>>>>>>>> $(document).ready(function() { > >>>>>>>>>>>> > >>>>>>>>>>>> $('.menu-details').hide(); > >>>>>>>>>>>> > >>>>>>>>>>>> $('#a-index').mouseover(function() { > >>>>>>>>>>>> var answer = $('#menu-details-index'); > >>>>>>>>>>>> if (answer.is(':not visible')) > >>>>>>>>>>>> answer.slideDown(); > >>>>>>>>>>>> > >>>>>>>>>>>> $('#a-index').mouseout(function() { > >>>>>>>>>>>> var answer = $('#menu-details-index'); > >>>>>>>>>>>> if (answer.is(':visible')) > >>>>>>>>>>>> answer.slideUp(); > >>>>>>>>>>>> > >>>>>>>>>>>> $('#a-buyers').mouseover(function() { > >>>>>>>>>>>> var answer = $('#menu-details-buyers'); > >>>>>>>>>>>> if (answer.is(':not visible')) > >>>>>>>>>>>> answer.slideDown(); > >>>>>>>>>>>> > >>>>>>>>>>>> $('#a-buyers').mouseout(function() { > >>>>>>>>>>>> var answer = $('#menu-details-buyers'); > >>>>>>>>>>>> if (answer.is(':visible')) > >>>>>>>>>>>> answer.slideUp(); > >>>>>>>>>>>> }) > >>>>>>>>>>>> }); > >>>>>>>>>>>> }); > >>>>>>>>>>>> }); > >>>>>>>>>>>> }); > >>>>>>>>>>>> > >>>>>>>>>>>> You can see the results of my efforts so far at > >>>>>>>>>>>> http://c21ar.wsm-dev.com > >>>>>>>>>>>> . > >>>>>>>>>>>> > >>>>>>>>>>>> The problems I'm trying to overcome: > >>>>>>>>>>>> > >>>>>>>>>>>> - the 'drop-down div' works only if the first menu item > >>>>>>>>>>>> "Home" is > >>>>>>>>>>>> mouse-over first > >>>>>>>>>>>> > >>>>>>>>>>>> - once the div drops, and I mouse-off the link, the div > >>>>>>>>>>>> closes...of > >>>>>>>>>>>> course I need it to stay open > >>>>>>>>>>>> unless I mouse-off the link or the corresponding drop- > >>>>>>>>>>>> down div > >>>>>>>>>>>> > >>>>>>>>>>>> - after I mouse-over the first two links quite a few times, > >>>>>>>>>>>> even > >>>>>>>>>>>> slowly, I get an alert error > >>>>>>>>>>>> that states "Stack overflow at line: 1" What does that > >>>>>>>>>>>> mean > >>>>>>>>>>>> and > >>>>>>>>>>>> can this be overcome or is > >>>>>>>>>>>> my 'drop-down div' menu inherently flawed? I have to > >>>>>>>>>>>> refresh > >>>>>>>>>>>> the > >>>>>>>>>>>> page to get the menu working > >>>>>>>>>>>> again > >>>>>>>>>>>> > >>>>>>>>>>>> - lastly, but my significantly, I've got to figure out a > >>>>>>>>>>>> way to > >>>>>>>>>>>> have > >>>>>>>>>>>> the system realize what > >>>>>>>>>>>> content should be displayed in the drop-down div based on > >>>>>>>>>>>> the > >>>>>>>>>>>> menu > >>>>>>>>>>>> link that is moused-over > >>>>>>>>>>>> > >>>>>>>>>>>> Would someone care to show me some code that would help > >>>>>>>>>>>> with > >>>>>>>>>>>> any of > >>>>>>>>>>>> these problems? > >>>>>>>>>>>> If this is going to take someone too much time to help out > >>>>>>>>>>>> "vacuus > >>>>>>>>>>>> persolvo", I'm willing to > >>>>>>>>>>>> purchase something off a wish-list or even to pay for some > >>>>>>>>>>>> hand- > >>>>>>>>>>>> holding. > >>>>>>>>>>>> > >>>>>>>>>>>> The problem I face is time... I'm working on a fairly > >>>>>>>>>>>> extensive > >>>>>>>>>>>> Real > >>>>>>>>>>>> Estate site and I need to > >>>>>>>>>>>> get past this piece of the puzzle. If I can't solve it > >>>>>>>>>>>> soon, > >>>>>>>>>>>> I'll > >>>>>>>>>>>> just have to go to a regular > >>>>>>>>>>>> drop-down menu, which I'd rather avoid. > >>>>>>>>>>>> > >>>>>>>>>>>> I just haven't come far enough with jQuery to code this > >>>>>>>>>>>> myself...it's too complex for me at this > >>>>>>>>>>>> point. > >>>>>>>>>>>> > >>>>>>>>>>>> Thanks! > >>>>>>>>>>>> > >>>>>>>>>>>> Rick > >>>>>>>>>>>> > >>>>>>>>>>>> > >>>>>>>>>> > >>>>>>>>>> > >>>>>>>>>> > >>>>>>> > >>>>>>> > >>>>>>> > >>>>> > >>>>> > >>> > >> > >> > > > > > >
