The expander plug-in looks very useful, Karl. I do this sort of thing with ColdFusion by cutting off text after two conditions have been met: 1) A certain number of characters have been displayed and 2) after the specified number of characters have been displayed, a punctuation mark has appeared. It can be done without the second step, but I try to cut off the text at the end of a sentence.
However, ColdFusion isn't capable of expanding the rest of the text without a refresh of the page...usually, I just take the reader to an article page. I can see this coming in handy for announcements, also...especially those that are lengthy. Thanks for the tip! Rick > -----Original Message----- > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Rick > Faircloth > Sent: Wednesday, January 16, 2008 9:43 PM > To: jquery-en@googlegroups.com > Subject: [jQuery] Re: Still working out "drop-down div menu"... > > > 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:[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 > > >>>>>> > > >>>>>> > > >>>> > > >>>> > > >>>> > > > > > > > > > >
