Solved

Slideshow not working right

Posted on 2014-04-03
2
243 Views
Last Modified: 2014-04-04
Hi,

Please look at : seasidewindow.com/test/gallery2.html

The slideshow is supposed to function sort of like this one, but with arrows for advance and back. : http://www.pikachoose.com/

I'll attach the code for the example page I have.without-carousel.html

the library folder is uploaded, the bottom.css is uploaded,  and I can't figure out why it's not working.

I know you can though! Thanks in advance!
0
Comment
Question by:mel200
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 53

Accepted Solution

by:
Scott Fell,  EE MVE earned 500 total points
ID: 39977137
Looking at the console, you are missing a css file and a couple of js errors.

ailed to load resource: the server responded with a status of 404 (Not Found) http://seasidewindow.com/test/slides/base.css
Uncaught ReferenceError: getTwitters is not defined scripts.js:133
Uncaught TypeError: Object [object Object] has no method 'fitVids' scripts.js:5
event.returnValue is deprecated. Please use the standard event.preventDefault() instead.

Open in new window


Looking at the basic example http://sorgalla.com/jcarousel/examples/basic/
<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Basic carousel - jCarousel Examples</title>

        <!-- Shared assets -->
        <link rel="stylesheet" type="text/css" href="../_shared/css/style.css">

        <!-- Example assets -->
        <link rel="stylesheet" type="text/css" href="jcarousel.basic.css">

        <script type="text/javascript" src="../../libs/jquery/jquery.js"></script>
        <script type="text/javascript" src="../../dist/jquery.jcarousel.min.js"></script>

        <script type="text/javascript" src="jcarousel.basic.js"></script>

    </head>
    <body>

        <div class="wrapper">
            <h1>Basic carousel</h1>

            <p>This example shows how to setup a basic carousel with prev/next controls and pagination.</p>

            <div class="jcarousel-wrapper">
                <div class="jcarousel">
                    <ul>
                        <li><img src="../_shared/img/img1.jpg" width="600" height="400" alt=""></li>
                        <li><img src="../_shared/img/img2.jpg" width="600" height="400" alt=""></li>
                        <li><img src="../_shared/img/img3.jpg" width="600" height="400" alt=""></li>
                        <li><img src="../_shared/img/img4.jpg" width="600" height="400" alt=""></li>
                        <li><img src="../_shared/img/img5.jpg" width="600" height="400" alt=""></li>
                        <li><img src="../_shared/img/img6.jpg" width="600" height="400" alt=""></li>
                    </ul>
                </div>

                <p class="photo-credits">
                    Photos by <a href="http://www.mw-fotografie.de">Marc Wiegelmann</a>
                </p>

                <a href="#" class="jcarousel-control-prev">&lsaquo;</a>
                <a href="#" class="jcarousel-control-next">&rsaquo;</a>
                
                <p class="jcarousel-pagination">
                    
                </p>
            </div>
        </div>

    </body>
</html>

Open in new window


You need to start with an unordered list of images enclosed by two divs  
<div class="jcarousel-wrapper">
                <div class="jcarousel">

Start over with the basic example and begin placing your own images.  Make sure all of your files are uploaded as well.
0
 

Author Closing Comment

by:mel200
ID: 39978593
Thanks, I got it working.
0

Featured Post

Space-Age Communications Transitions to DevOps

ViaSat, a global provider of satellite and wireless communications, securely connects businesses, governments, and organizations to the Internet. Learn how ViaSat’s Network Solutions Engineer, drove the transition from a traditional network support to a DevOps-centric model.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Although a lot of people devote their energy toward marketing for specific industries, there are some basic principles that can be applied to any sector imaginable. We’ll look at four steps to take and examine how those steps were put into action fo…
When it comes to security, close monitoring is a must. According to WhiteHat Security annual report, a substantial number of all web applications are vulnerable always. Monitis offers a new product - fully-featured Website security monitoring and pr…
The viewer will get a basic understanding of what section 508 compliance can entail, learn about skip navigation links, alt text, transcripts, and font size controls.
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question