Sorry found a typo in my example...

$("#jlist") ... should read $("#list")

This is not an error in the script just an error in copy/paste!


On Dec 23, 11: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

Reply via email to