Hi Janet and all of you that reply to this post,
Like Chris said there is an interesting avenue in CSS developed by Stu Nicholls of CSSPlay at this page: http://www.cssplay.co.uk/menu/more.html. Stu used only CSS and a little JavaScript to do that. Unfortunately, it does not work very well in all browsers. Some experts in JavaScript say that it is possible to modify this little JavaScript to get a better result. But I am not a JavaScript Expert and I do not know how. There are some comments on this page at CSSPlay: http://www.cssplay.co.uk/comments/comments.php?comment_id=more%20poetry asking Stu advices for corrections on that coding. Many of them found limitation on using an <em> tag or the impossibility to add links in the hidden text. I am one of them. To be able to put <h> tags in it would be useful to. Maybe the use of links and <h> tags would be appreciated by you to. Stu propose to use nested tables like he used in his drop down menus to get links in the more part. I am not a CSS expert. I tried this advice without success. Maybe Chris or another more skilled CSS user than me will be able to make this and show us how to achieve this. The "more" part is embedded in a link. There are not many nested tags validate in a link tag. Stu used a <em> tag. It is not possible to put a <h> tag that validate in a <em> tag. I changed the <em> for a <ins> and now it is valid. At least I gain this point. Stu answer this comment: If there is a need for this then I might be persuaded to produce a 'more v2'. Maybe Stu will make them if there is a lot of comment asking for this all CSS more v2. Or we have to wait for the demo that Chris talk about in one of is reply for this topic. Anyway, an all CSS solution will be welcome. gjfortin ----- Original Message ----- From: "Janet Chang" <[EMAIL PROTECTED]> To: "Christian Heilmann" <[EMAIL PROTECTED]> Cc: <css-d@lists.css-discuss.org> Sent: Thursday, August 10, 2006 10:38 AM Subject: Re: [css-d] Show more text using CSS > At 03:08 PM 8/9/2006, Christian Heilmann wrote: > >> >> >>Basically, we need some way to code a "Show More" function that would > >> >> allow > >> >> >>us to take a long piece of text, shorten it to X maximum lines, then > >> >> have a > >> >> >>"Read more" link that when clicked would display the rest of the > >> text on > >> >> >>the page below the first half. > >> > > >> >There you go: > >> >http://icant.co.uk/sandbox/morecontentlinks/ > >> > > >> >I didn't use any fancy word counting or anything, but instead you need > >> >to set a div with the class "more" around all the elements you want > >> >hidden. > > > >>Great, thanks! I will play around with implementing it on our pages. One > >>more thing....How would you do a "Hide" link to make the extra text > >>disappear after you're done reading it? > > > >Added this functionality... > > > >-- > >Chris Heilmann > >Book: http://www.beginningjavascript.com > >Blog: http://www.wait-till-i.com > >Writing: http://icant.co.uk/ > > Thanks, Chris. I was able to get the code you sent to work with our text. > However, I'm wondering if there's a much less complicated formula for > getting this to work like that blog site without having to link to 4 js files? > > > ______________________________________________________________________ > css-discuss [EMAIL PROTECTED] > http://www.css-discuss.org/mailman/listinfo/css-d > IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 > List wiki/FAQ -- http://css-discuss.incutio.com/ > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ > ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
