Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
Re: Looking for good slider/carousel
I had that problem and then read somewhere (on the road at the moment so can’t check where) that some browser have problems with interpreting the js of certain minified files. I switched to the pack.js that’s often provided and then it worked without me making any changes to my code.
TXP Builders – finely-crafted code, design and txp
Offline
Re: Looking for good slider/carousel
I’m also wanting to create a Slider EXACTLY the same as Whitehouse.gov!
I’m having some difficulty using it though, I’ve downloaded jCarousel, but I can’t my idea implemented. For starters the JS adds the arrows by default and I can’t figure out how to remove them. I also want to have the number links, but also have them have active states so that you know where abouts in the slider you are. Finally I’d like to have it so it AUTO starts and loops through the slides.
Would anyone be able to post the code for doing this? Thanks. x
~ Cameron
Offline
Re: Looking for good slider/carousel
Driz,
I’m not familiar with jCarousel – try the #jquery IRC channel. They are pretty helpful.
Otherwise, try the cycle plugin or tabs UI – I posted most of what you need to make it work a bit further back.
Offline
Re: Looking for good slider/carousel
bummer well I’ve put together this for the slideshow, now all i need to do is get it to slide using j:
<div id="slideshow">
<ul id="slides">
<li>
<div class="text">
<h1>Welcome to SolidCAM UK Ltd</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<img src="sample.jpg" />
</li>
<li>
</li>
<li>
</li>
<li>
</li>
<li>
</li>
</ul>
<ul id="pagination">
<li class="on"><a href="">1</a></li>
<li><a href="">2</a></li>
<li><a href="">3</a></li>
<li><a href="">4</a></li>
<li><a href="">5</a></li>
</ul>
</div>
~ Cameron
Offline
#29 2011-06-07 10:12:07
- fantasmo
- Member
- Registered: 2010-05-05
- Posts: 40
Re: Looking for good slider/carousel
This carousel is not a “Texpattern Plugin”, is it?!
I like jCarousel, and I think it is possible to have it in Textpattern without knowing something about Plugin-Coding (which I don’t).
How do I put out Images wrapped by <li> tags? And how do I say “put a class tag in each 4th <li>”? And at least, I would need this to fetch the images from a folder, no manually inserting into the code.
If I knew that, I bet it would be easy to have jCarousel for my website.
Offline
Re: Looking for good slider/carousel
@fantasmo
Looking at the basic demo of jCarousel, make sure you link your css in the head, then something like this would suffice…
<ul id="mycarousel" class="jcarousel-skin-tango">
<txp:images sort="id asc" category="gallery" break="li"><txp:image /></txp:images>
</ul>
And then in your footer, after the script links to jquery and jcarousel:
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel();
});
</script>
That will automatically pull in any images from textpattern that are in a category of ‘gallery’.
Regards,
Phil
Offline
#31 2011-06-07 11:42:19
- fantasmo
- Member
- Registered: 2010-05-05
- Posts: 40
Re: Looking for good slider/carousel
@phil
Thank you very much for the code, I will try that.
One little thing… I want to make a grid look, so I thought about two solutions:
1. all <li> one below the other, and after maybe ever third <li> i would clear the float with a class :
<li><img></li>
<li><img></li>
<li class="floatEnd"><img></li>
2. one <li> contains more images, and then again these <li> one below the other:
<li>
<img>
<img>
</li>
<li>
<img>
<img>
</li>
The second one will not use a class and seems to be easy… but I believe there is no attribute for <txp:image> to say “put 3 images into li”…and when simply put three image-tags between <li> I guess it would show three times the same picture (haven’t tried it yet, but I believe I had something like this long time ago).
Offline
Re: Looking for good slider/carousel
I’m not sure what effect you want to achieve – you want the carousel to jump 2 images on every click scroll?
Offline
#33 2011-06-08 08:25:07
- fantasmo
- Member
- Registered: 2010-05-05
- Posts: 40
Re: Looking for good slider/carousel
The carousel should contain maybe 25 pictures (5 lines with 5 pictures) and on click it slides in the next 25 pictures.
Offline
Re: Looking for good slider/carousel
Just curious… now with mobile soon to surpass desktop usage, can any of these sliders be used in two states depending on device?
For example, for mobile devices I wouldn’t want something auto-rotating/sliding… I’d want to let users thumb-swipe right/left as they wanted too. But in non-touch devices, I’d want the carousel to start auto-rotating, much like the Whitehouse one does.
Anyone have something like that setup? Finger swipe coding is new ground for me still.
Offline
Re: Looking for good slider/carousel
I’m waiting for Swipe2 to be finished and released, that’ll do what you want (the swipe functionality is great).
Offline
Re: Looking for good slider/carousel
Saweto!
Offline