SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Wizard billy_111's Avatar
    Join Date
    Jul 2009
    Posts
    1,683
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    how can i do this?

    Hey,

    Take a look at this page:

    http://www.hangingditch.com/index.php

    If you look at the "Monthly Specials" box, you will see a product. This is being pulled out of a database but there will be over 40 of the specials so i need to tab to next/previous with the arrows provided. Can this be done?

    Currently i am only SELECTING one special to show you what i intend to do, but i need to select ALL of them which adds up to about 40 so is there a way possible to tab through to next and previous ??

    Can you provide an example if possible so i can head in the right direction.

    Thanks again
    Software Engineer ASP, ASP.NET, VB, PHP

    Kind regards
    Billy

  2. #2
    SitePoint Guru downtroden's Avatar
    Join Date
    Dec 2004
    Location
    illinois
    Posts
    976
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    http://flowplayer.org/tools/scrollable/index.html

    right there. That and jquery is all you'll need.
    your brain reacts in the same way whether you are
    looking at something or thinking about it...

  3. #3
    SitePoint Wizard billy_111's Avatar
    Join Date
    Jul 2009
    Posts
    1,683
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey,

    Thanks for the link, i have almost got it working, however have a few styling issues but i think its best to post here.

    If you look at this page now: http://www.hangingditch.com/index.php

    Click on the arrows next/previous you will see the scrolling function working, however the next tab appears near the bottom of the first tab, and when i click next it doesn't show the ACTUAL second tab it shows the first tab again.

    How can i fix this css to increase the height so you cannot see the second tab ??

    Thanks
    Software Engineer ASP, ASP.NET, VB, PHP

    Kind regards
    Billy

  4. #4
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,097
    Mentioned
    153 Post(s)
    Tagged
    2 Thread(s)
    You should either put a <br clear="all" /> at the end of each special (just before the <h3>montly special</h3> of the next one)

    Or, put this in your CSS
    Code CSS:
    #flowpanes h3 {
      clear: both;
    }
    Rémon - Hosting Advisor

    SitePoint forums will switch to Discourse soon! Make sure you're ready for it!

    Minimal Bookmarks Tree
    My Google Chrome extension: browsing bookmarks made easy

  5. #5
    SitePoint Wizard billy_111's Avatar
    Join Date
    Jul 2009
    Posts
    1,683
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey,

    I have put a clear on the h3 but it doesn't seem to work. I have this code:

    PHP Code:
                    <div class="boxesmiddle">                       
                        <div class="links">
                          <img src="http://<?=$_SERVER['SERVER_NAME'].$sitename?>images/prev.jpg" alt="" class="custom prev left" style="cursor:pointer"/>
                          <img src="http://<?=$_SERVER['SERVER_NAME'].$sitename?>images/next.jpg" alt="" class="custom next right" style="cursor:pointer"/>
                        </div>
                        <!-- panes -->
                        <div id="flowpanes">                
                            <!-- wrapper for scrollable items -->
                            <div class="items">
                                <div>            
                                <?
                               $specials 
    Specials::SelectAllSpecials();
                                   while(
    $row mysql_fetch_array($specials)){
                                   
    $text strip_tags($row['description']);
                                   
    $intro substr($text0100);
                                
    ?>
                                <img src="http://<?=$_SERVER['SERVER_NAME'].$sitename?>specialsimages/<?=$row['theImage']?>" alt="" class="left marginright10px homepagespecialsimg"/>
                                <h3>monthly specials</h3>
                                 <p style="margin-bottom:8px"><strong><?=$row['theName']?></strong></p>
                                <p><?=$intro?>...</p>
                                <?  
                                
    }
                                
    ?>
                                  </div>
                             </div>
                         </div>
                     </div>
    Now when i view source it does show all 4 specials, but if you look at the front end, now it has made the text disappear, and the image of the wine stays the same:

    http://www.hangingditch.com/

    Any ideas what i'm doing wrong?

    Thanks again ScallioXTX
    Software Engineer ASP, ASP.NET, VB, PHP

    Kind regards
    Billy

  6. #6
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,097
    Mentioned
    153 Post(s)
    Tagged
    2 Thread(s)
    You're not doing anything wrong, I'm doing it wrong, putting a clear: both on the h3 clearly doesn't work, I should have seen that

    That being said, I would would wrap a div around each special. No CSS required, just wrap it in a div (and remove the clear:both from the h3 of course). There might be better solutions, but I can't think of any.
    Rémon - Hosting Advisor

    SitePoint forums will switch to Discourse soon! Make sure you're ready for it!

    Minimal Bookmarks Tree
    My Google Chrome extension: browsing bookmarks made easy

  7. #7
    SitePoint Wizard billy_111's Avatar
    Join Date
    Jul 2009
    Posts
    1,683
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey,

    It's working now, i put the DIV inside the while loop and now it works :-)

    Thanks again
    Software Engineer ASP, ASP.NET, VB, PHP

    Kind regards
    Billy


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •