Anyone know a jquery plugin I can use for a horizontal scrolling image carousel with different size images. I Iike the plug in here as my client will be easily able to put new content using a simple text file. The problem is that the images will be the same height but different width so I get ugly spaces between narrow images. Is there a plug in that solves this or is there a way to manipulate the css for each image so as to adapt the width of the div ? I can add the height and width properties of the images themselves to the text file and that works up to a point , but the images display at their correct size but the carousel stops working.
I am trying to set up a jQuery carousel on my home page. I want it to operate by mouse - also auto scrolling, be horizontal, be circular, show one image at once.
I currently have three images to show one at a time in a containing div. All three images are showing together. One is in the container, in the right place, two others are shown below it. These two should be hidden in the carousel. The carousel itself, does not work. code...
I'm working on modifying a jQuery plugin that makes an image carousel. I like how it is not with one exception... I'd like the images to overlap one another. So the main image that is displayed will overlap the ones on either side of it somewhat.
You can view the source of the demo I posted to look at the JS for it... I used the "moving boxes" plugin and already modified it a lot.
I have two separate questions. One being, how would I go about having the container resizing itself for different image sizes. So that surrounding elements can conform to it's size?
Also, is there a way to align the images in a slide shows so that it is always horizontally and vertically centered in the slideshow?
I am working on a plugin and have a test page setup here...to test bigSIZE click the 'BIG' button first, then mouse over the colored boxes. It works fine if all the boxes are the same size...the problem comes when you change the box sizes (I added the form to change the sizes for testing). For example if 3 boxes are 100x100 and one is 25x25 the 100 boxes will still work but the 25 will not.
Also, if the mouse leaves the box during the grow animation it will stay grown until you reenter and then trigger a mouseleave, so I need to fix that but I'm not quite sure how to do that either.
I'm working on implementing a menu and need to have information when the menu size is larger than the width of the window. The problem is that pas a certain point, jQuery("body").width() keeps registering 497, despite being much smaller than that. Has anyone had this issue
Is it possible to make it so that image that is displayed in the div is limited to certain dimensions.. say 100 by 100px. If an image that is displayed is above the limit, the excess is simply just out of view..
I dunno how this would be possible maybe by a use of some sort of mask, i normally code inflash im not sure if taht is possible with divs in html. Or maybe you can limit the size in the js file, if your allowed to.
I have a link that when clicked it opens up a pop up window. However, this window has a dramatic size change in different browsers, from way to small, to extremely large...
how can I make this pop up window have a similar size in all browsers...currently I have it set at 500 x 200.
If the user has not entered data in a textbox I display a message in the textbox in italics.After the user has entered a message their message is then stored in normal textstyle.I am noticing that the textbox changes length when the fontstyle changes. Is there a way to prevent this from happening?
Have to make a calculator to calculate wallpaper sizes and cost (college course so not for the 'real world' so doesnt need a great deal of functionality. Do i make a form in html and then name each cell? what then? Lost as hell here and been watching countless tutorials for js, need guidance i think now.
I'm planning on making a website which is mainly just a gallery of images.
The site will essentially look like one page with a jCarousel on it, when the user clicks left or right on the carousel, I would like the URL to change but for the animation not to get interupted.
I would also need to change some HTML on the page too, essentially each image will have a Facebook 'like' button and that will need to change to the corresponding URL.
The carousel is going to be database driven and dynamically built up with potentially 1000's of images, so I'm not sure what the best technique for this would be? I'm building it in ASP.NET / Ajax and using the SlideJS carousel [code]...
I don't have a ton of experience with JQuery, but I'm trying to design a carousel using Agile Carousel, the plugin. I've copied the code correctly, but nothing shows up. My code is as follows:
Here is the jCarousel lite page : [URL] And here is my project : [URL] Carousel pager works great, when you click a page, carousel switch to the chosen page. But if you try to drag an item outside the carousel (green border), the item won't go above the carousel border, but underneath.
I'm trying to create a horizontal carousel/slider that will display my latest Tweet.
I started with some code I found to pull in my latest tweets via .json. I got that all set up and now I'm trying to integrate the bxSlider plugin to cycle through these tweets one at a time.
At this point I get all the tweets in a <li> that cycle through together. I've set up a jsfiddle to demonstrate what I have
I have the cycle plugin running happily along on a website, but I really need to be able to sometimes add a thumbnail carousel at the bottom of the slideshow a bit like the one in galleria classic (here). Does anyone know of a good solution or am I better off looking for something else?Galleria doesn't work in ie6 apparently and also I'm quite happy with everything else about cycle.(edit - the advanced pager demo on the cycle site isn't really shiny enough, by the way. It doesn't scroll or change with the gallery)
[URL]This is my website and you can see the images in the header are messed upbecause I tried to use "jcarousel" but it is not working and I have to sort this out
I find that either of these plugins work in isolation but together they are clashing. The first to be specified in my initialisation code works, the following doesn't. Initialisation code looks like this:
I've got an infinite jQuery carousel, which is working, however I need to make a couple of tweaks and I don't know where to start. Below is the code for a visually simplified, but technically identical version:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL]"> <html xmlns="[URL]"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Page Title</title> <script src="[URL]" type="text/javascript"></script> <script type="text/javascript"> $.fn.infiniteCarousel = function () { function repeat(str, num) { return new Array( num + 1 ).join( str ); } .....
Basically, I'm trying to achieve two things: 1. The script creates empty carousel items; these are visible in yellow when you scroll through the items by clicking on the blue squares. How can I remove these so that item '6' goes straight back to item '1', without the two empty list items in between? 2. At the moment two clicks allow you to see all 6 'real' squares, plus the two empty yellow ones. How can I make it so that it scrolls one list item at a time, rather than 4 at present?
I'm currently having difficulty to debug this issue in ie7. When the page is loading, all carousel lists are exposed and content displays for a couple of seconds.
what I want to learn to do is have a feature on my website: [URL] where under the portfolio section there are multiple links (product, packaging, identity etc) I want different carousels to show up on the .index page when you click a certain one of those links. In old school HTML I believe you would use a frame but I know there is a better way to do it using jQuery. [URL](work section) does exactly how I want it to be except I don't need the fancybox feature.
Adobe forums suggested a jquery solution. I want to continuously rotate my customer testimonials without requiring users to click to advance. I have successfully implemented rotating text, but am having problems including the image too.
On this page, the words "cash register" is actually the "alt=" for the image, but no image displays.[URL]..
I'm using jMyCarousel [URL] for a 100% width horizontal infinite thumbnail scroller, but can't figure out how to add one last piece of functionality. Here is the feature in its current stage of development: [URL]. I've got the hover-to-pause part working (clunkily in terms of backend but it works), but now I need the house image to start centered on the page and pause there for two seconds, and then automatically slide with easing effects to center the next image for two seconds, and so on, rather than have one long continuous scroll. I'm very new to JQuery and if this project wasn't deadlining in a few days, I'd totally study a JQuery slider to see how they do the thing I need and try to adapt it for this carousel, but I'm afraid it's out of my league right now.
Its a long shot posting here but the task I'm using a jQuery Carousel that has a youTube video embedded on one of the slides:
[URL]
I have is does any one know a way that when the user clicks a new slide the youTube video pauses, turns off, or at the very least the volume of the video is set equal to zero.
I dedicated some time creating my own carousel with images, and got a little problem:
It works perfectly when I´m on the website, but when I change between the tabs on firefox/chrome, it seems that the function make some kind of queue, and when I come back to the website, it execute the function a lot of times at the same times, passing between the images in less than half second (I configured to change every 5 seconds).
function circCar (car) {
Here is the code, and if anybody wants to see the problem, open this url, open another tab (blank or another website) and stay on it about 15 seconds, when you come back to my site, you will see the queued function. [url]