Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Need help with jQuery/CSS  thumbnail gallery

Posted on 2013-05-29
2
Medium Priority
?
353 Views
Last Modified: 2013-05-30
Hi,
I love the look of this gallery http://www.twospy.com/galleriffic/example-3.html but would like to have the thumbnails under the main pic

If I change div.content as below it works fine but I cant seem to work out how to get the thumbnails across whole page instead of 3 columns?

Any ideas?


div.content {
      display: none;
      float: right;
      width: 550px;
}

to

div.content {
      display: none;
        margin:0 auto;
      width: 550px;
}
0
Comment
Question by:sabecs
  • 2
2 Comments
 
LVL 4

Expert Comment

by:Ahmed Hussein
ID: 39204288
HYG,

Add this to your CSS file, or inline style.

#thumbs{
 width: 100%;
float: left;
opacity: 1;
}
div.content {
float: right;
width: 100%;
}

Open in new window


~AG
0
 
LVL 4

Accepted Solution

by:
Ahmed Hussein earned 2000 total points
ID: 39204330
And to center the slideshow picture do this:

change left value for div.slideshow span.image-wrapper from left:0; to left:20%;

div.slideshow span.image-wrapper{
   left:20%;
}

Open in new window


and add this:

div.navigation {
width: 100%;
}

Open in new window


and should work like a charm.

~AG
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

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

Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
The viewer will learn how to dynamically set the form action using jQuery.
Suggested Courses
Course of the Month11 days, 6 hours left to enroll

572 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