[jQuery] Re: Jquery + ie7 spans

It doesnt have a line break .. neither a \n(\r) nor a <br />

On Dec 24, 4:48 pm, brian <zijn.digi...@gmail.com> wrote:
> Does it work if the span does not have linebreak before it?
>
> On Wed, Dec 23, 2009 at 6:05 AM, Alex Mcauley
>
> <webmas...@thecarmarketplace.com> wrote:
> > Morning and happy holidays!..
>
> > I am having some trouble with jQuery and IE7 quirks (suprise
> > suprise)..
>
> > Basically i wrote a script that truncates some text and when "More
> > Details" is clicked - JQuery unhides the truncated text and adds a
> > "Less Details" link at the bottom (which inturn hides the revealed
> > text) ..
>
> > This all works well in FF, Chrome, IE8 (shocker), Safari and pretty
> > much every other browser i have tried.
>
> > The trouble in IE7 is that the hidden (truncated) text lies in a
> > <span> tag & it wants to put the tag on a new line - quite annoying
> > when it splits a word like this ...
>
> > [Example - Before "more details" is clicked]
>
> > This is some tex.. (More Details)
>
> > [Example - When "More Details" is clicked]
>
> > This is some tex
> > t and here is  some more text blah blah (Less Details)
>
> > Yet in IE8/FF/Etc it looks like this...
>
> > [Example - Before "more details" is clicked]
>
> > This is some tex.. (More Details)
>
> > [Example - When "More Details" is clicked]
>
> > This is some text and here is  some more text blah blah (Less Details)
>
> > I have tried display:inline-block, display:inline and every
> > combination i can think of but i cannot get the text to sit on one
> > line in IE7 only...
>
> > Here is the mark up...
> > <div id="list">
> > <div class="entry">
> > Head of Web Analytics with excellent experience of web analytics and
> > data analysis is required by a leading London based organisation. You
> > should have an excellent grasp of web analytics tools such as
> > Omniture, Hitwise, web trends, google analytics etc. Experience with
> > data analysis, Excel and working with remote teams is also beneficial.
> > If you have team leading experience then this would be advantageous
> > but n
> > <span class="show-more-details">...<a href="/details/21427/">More
> > Details</a></span>
> > <span class="more-details">
> > ot essential. Being highly analytical is a must and you should hold
> > some sort of numerical degree. This is a fantastic role for one of
> > Londons most dynamic and forward thinking companies. This is very much
> > a team lead role; you shall be leading a team of online analysts and
> > business analysts. Your role will be to give insight and
> > recommendations for online strategies by analysing web statistics and
> > other statistical information. This is a fantastic role that has
> > massive scope for potential. You shall be working on a lot of exciting
> > projects and you become an integral part of the business. My client is
> > looking to pay a starting salary of between 55 66K + Benefits. <a
> > class="show-less-details" href="#">Less Details</a>
> > </span>
> > </div>
> > </div> <!-- End #list -->
> > -------------------------
>
> > Here is the jQuery that handles the clicks...
>
> > $("#list .show-more-details").click(function(ev) {
> >                ev.preventDefault();
> >                $(this).hide();
> >                $(this).next("span.more-details").fadeIn(200);
> >        });
> >        $("#jlist .show-less-details").click(function(ev) {
> >                ev.preventDefault();
> >                var that=this;
> >                $(this).parents('.entry span').prev('.show-more-details').fadeIn
> > (200,function(){
> >                $(that).parent('span.more-details').hide();
> >                $(that).parents('.entry span').prev('.show-more-details').show(); //
> > IE8 Fix
> >                });
>
> >        });
>
> > As i said it works in every other browser (haven't tested IE6 but i
> > dont care about that)...
>
> > Has anyone had this problem before and knows a fix ?
>
> > Thanks in advance
>
> > Alex