0

The title of my question needs more explanation...

I'm building a site for a rugs company. Last week I placed a question to make an accordion menu place an image in a different div

Image presentation using an accordion menu

but now, I was required to append more info to the images.

So... I have a menu like this:

    <ul class="leve1">
        <li>
           <div class="some">
           <a href="images/rugtype/image1.jpg">image1</a>
           <a href="images/rugtype/image2.jpg">image2</a>
           <a href="images/rugtype/image3.jpg">image3</a>
           ...
           </div>
       </li>
       ...
   </ul>

Update

New day, new thinking...

my menu has changed a bit and my question changed also...

I need to add to the site a div with the specs of each rugtype, but only to be displayed when you click on a link.

I place the rug image in a div next to the menu using:

$("div.some a").click(function (event) {
    event.preventDefault();
    $("div#dest").html($("<img>").attr("src", this.href).fadeIn(1000));
});

Is there any way for me to get the rugtype info from the href above?

Community
  • 1
  • 1
jpferreira
  • 1
  • 1
  • 1
    You can't read an XLS file as text. However you could save it as CSV and parse it that way. However, much easier than all of those would be to use a database. – Rory McCrossan Sep 17 '13 at 09:23
  • All you have to do is to read the XLS file in js in CSV mode . First save the xls as a `csv` file. Now see this : http://stackoverflow.com/questions/7431268/how-read-data-from-csv-file-using-javascript. You can read it using jquery-CSV plugin as well : http://code.google.com/p/jquery-csv/ – The Dark Knight Sep 17 '13 at 09:26
  • the code changed, so I won´t be using CSV~@Rory - the database will be used further on (it's a growing project) and @The Dark Knight appreciated about reading CSV, will use in another project ;) – jpferreira Sep 18 '13 at 15:17

1 Answers1

0

Try adding the img element using html method. After it, find it using the find method and apply and fadeIn effect, for sample:

$("div.some a").click(function (event) {
    //prevent default
    event.preventDefault();

    // get the href property
    var href = $(this).prop('href');

    // find the div and add a img with display:none, locate the img and fadeIn
    $("div#dest").html("<img src='" + href + "' style='display:none;' />")
                 .find('img')
                 .fadeIn(1000));
});
Felipe Oriani
  • 37,948
  • 19
  • 131
  • 194
  • Probably I wasn't very clear... or I'm being plain dumb... I just want to get the "rugtype" in "../images/**rugtype**/image1.jpg". I've tried using a .split("/") but didn't work. – jpferreira Sep 18 '13 at 15:36