Developer's Forum

Solving daily Web Developing problems

Developer's Forum Logo

CodeGround - Forum » Magento

How to create content slider

Tags:

No tags yet.

  1. Krite

    into the Matrix
    Joined: Nov '10
    Posts: 129

    offline

    I looking in this site : http://developer.practicalecommerce.com/articles/2716-Create-a-Custom-Magento-Theme-Part-11-Preparing-for-the-Content-Slider

    but I have followed the example on this site but not display. please help me. thank you.
    Remark : this is a code in style.css and my picture is a skin\frontend\default\Legopirate\images and detail site my picture

    Promotion-Brilliant-Basics-Activity-Walker.jpg = 655 *372 pix or 21.11 *13.12 cm.
    Tag Gift Pack featuring Disney•Pixar Cars.jpg = 655 *372 pix or 21.11 *13.12 cm.
    Vtech-Disneys-Cars-Lightning-McQueen-Learning-Laptop.jpg = 655 *372 pix or 21.11 *13.12 cm
    Learning System Software Disney Pixar Cars 2a.jpg = 655 *372 pix or 21.11 *13.12 cm

    this code in style.css
    /* 2 Columns Layout */
    .col2-left-layout .col-main { float:right; }
    .col2-right-layout .col-main {}

    /*Content Slider & Hero Images */
    #content-slider img {border: #fff solid 5px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px;}

    #content-slider .five-img-slide {list-style: none; margin: 0 0 0 -8px; position: relative; width: 960px; height:470px;}
    #content-slider .five-img-slide li {display: inline; position: absolute;}

    #content-slider .five-img-slide .slide5-2 {left: 370px;}
    #content-slider .five-img-slide .slide5-3 {left: 370px; top: 280px;}
    #content-slider .five-img-slide .slide5-4 {left: 570px; top: 280px;}
    #content-slider .five-img-slide .slide5-5 {left: 720px;}

    <ul class="three-img-slide">
    <li class="slide4-1">getSkinUrl(images) ?>/Promotion-Brilliant-Basics-Activity-Walker.jpg" alt="Brilliant Basics Activity Walker/>

    <li class="slide4-2">getSkinUrl(images) ?>/Tag Gift Pack featuring Disney•Pixar Cars.jpg" alt="Tag Gift Pack featuring Disney•Pixar Cars"/>

    <li class="slide4-3">getSkinUrl(images) ?>/Vtech-Disneys-Cars-Lightning-McQueen-Learning-Laptop.jpg" alt="Vtech-Disneys-Cars-Lightning-McQueen-Learning-Laptop"/>

    <li class="slide4-3">getSkinUrl(images) ?>/Learning System Software Disney Pixar Cars 2a.jpg" alt="Learning System Software Disney Pixar Cars 2a"/>

    #content-slider .three-img-slide {list-style: none; margin: 0 0 0 -8px; position: relative; width: 960px; height:470px;}
    #content-slider .three-img-slide li {display: inline; position: absolute;}
    #content-slider .three-img-slide .slide3-2 {top: 235px;}
    #content-slider .three-img-slide .slide3-3 {left: 610px;}

    getSkinUrl(images) ?>/Hotproduct.jpg" alt="Hotproduct"/>

    Posted 7 months ago #
  2. Rick

    Administrator
    Joined: May '10
    Posts: 397

    offline

    It's so hard if I can't see the front end...

    What does it show?

    Posted 7 months ago #
  3. Krite

    into the Matrix
    Joined: Nov '10
    Posts: 129

    offline

    If I want to adjust the gap between the images. How do I get a thank you from the static block.

    this code in static block :
    <table style="height: 559px; width: 980px;" border="0" cellspacing="5" cellpadding="5">
    <tbody>
    <tr>
    <td></td>
    <td>
    <table style="height: 372px; width: 325px;" border="0" cellspacing="0" cellpadding="0" align="right">
    <tbody>
    <tr>
    <td></td>
    </tr>
    <tr>
    <td></td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    <tr>
    <td></td>
    <td> </td>
    </tr>
    </tbody>
    </table>

    Posted 7 months ago #
  4. Rick

    Administrator
    Joined: May '10
    Posts: 397

    offline

    Perhaps setting the cellpadding and cellspacing to 0.

    cellspacing="5" cellpadding="5"

    To:

    cellspacing="0" cellpadding="0"

    Posted 7 months ago #
  5. Krite

    into the Matrix
    Joined: Nov '10
    Posts: 129

    offline

    Thank you very much. but What did i do? If I want a big orange picture to slide automatically assign a Static block is 5 picture what should i do. Please help me. Thank you very much.
    this my image site and i want add slide script in http://www.todaytricks.com/5-best-magento-image-slider-extension-for-your-store/ ( mag image slider )

    Posted 7 months ago #
  6. Rick

    Administrator
    Joined: May '10
    Posts: 397

    offline

    Hi Krite,

    The link you posted has several different slideshows.

    You should follow the given instructions by the authors.

    Posted 7 months ago #
  7. Krite

    into the Matrix
    Joined: Nov '10
    Posts: 129

    offline

    thank you very much.

    Posted 7 months ago #

RSS feed for this topic

Reply

You must log in to post.