This author's response time can be up to 5 business days.
In my app, you click a button and “spin” the carousel. I first change it to autorotation: true and then after a time, I use the moveTo() function to select a certain item. My problem is that in using moveTo, it calculates the closest way to rotate, which is sometimes the opposite direction of the spinning and it looks bad.
How do I force the moveTo() function to only move in a certain direction?
This behavior is not configurable. I have to think about some workaround and will get back to you (in a 2-3 days).
Meanwhile could you please send me the settings that you use?
Here is the code for most of the app:
Specifically, if you look at the function $spinClick() there is the setTimeout which removes autorotation and then does a moveTo.
What it is designed to do is this:
1- you click the Spin button
2- the carousel spins for about 1 second and then lands on a predetermined item.
So when moving to the predetermined item, I want the spinning motion to look natural and seamless.
If there is a workaround that involves adding a function to my app.js here, that would be fine too.
Thanks very much!
Use moveToAndStopRotation(index) in browser console to see how it works.
I just speeding up the autorotation, till the carousel gets to the item that I need, and then I stop it. So it is similar to GoTo except the rotation direction is always the same.
Don’t forget to put theta-carousel.min.js into the Scripts folder.
Thanks very much for this- it worked great!
Issue: When clicking anywhere within the carousel container for the first time after page load, the page jumps. It only happens on the first click.
Environment: Mac Chrome, Mac Safari. Interestingly it is not happening in Mac Firefox.
Any idea what might be causing this to happen on my site?
The url is not accessible for me. I’m getting 401 Unauthorized error.
Sorry didn’t see the login. I’m in.
I’m troubleshooting on my end and the fix appears to be to change .carousel-container height from 100% to a fixed height of 760px.
Add the following line of code at the end of buildCarousel function (viewpoints.js)
Thank you for the extremely fast reply. I’ve added that line of code and modified the height settings and the jumpy behavior is gone.
If you like the carousel could you please leave 5 stars for us?
my name is Marco from Berlin. I was looking for a different option to show content to my website audit. I´ve found your offer and I thought yes that looks like what I need. I downloaded after buying and I´ve followed your instruction by video. Unfortnunally, at a mobile
inquiry the view is very small and actually you need a zoom. For me is very important to find a solution to get the step in the future right. (Mobile first) Do yo have any solution getting the images bigger without distroying the base idear of your nice carousel?
We can try to play with zoom (designedForWidth/designedForHeight)
Is your web page available online? I’ll take a look.
we have tryed but we are working with breacking points in css.(responsive webdesign) The function of the editor, how we interpret it, works just in one view with zoom. When we jump from one breakpoint to another like desctop version to mobile version it´s impossible to get an acceptable Result.If it would be possible link to CSS extern the editor to configure in between the breaking points than our developer team has an opportunity to reach the right result. Do you have any other solution to us?
we work local so no website online
Maybe you can share some screen-recording video?
Thank´s for your help. Yesterday, the CEO and the developer team tryed to find a solution but it didnt success. Sorry it is a nice rebirth of the carousel but please we would like to launch a ticket for a refund. What do you need? What we have to do? Kindly, regards Marco
This article describes how to request the refund:
I can’t trigger the refund by myself (and I think the approval from Help Team will be needed), but I’ll give my approval if it is required.
Great Plugin. I’m using http://theta-carousel.com/carousel-example.html#example=line1. We don’t want the text, I have removed the variables, text and events related to that. But the slider width remains same, I want it to make it full width to the page.
How can we do that? Please help.
Try to use the following settings:
Is it something similar to what you wanted to achieve?
If not, you also can try to change the configuration with the help of our configurator – https://ibb.co/k5D8Jw
See the help page for more details http://theta-carousel.com/api.html#configurator
Can you provide an example where you are adding and removing items from the carousel with an add and remove button or something similar ? I’m looping through an array and generating the items for the carousel – works fine. I would like to delete or add items to the array and then update the carousel in place. (without refreshing the entire page) . I don’t see any examples in the downloads or your website but I do see an update method.
I created a small example, please see it bellow:
Don’t forget to add theta-carousel.min.js into the Scripts folder.
Is there a way to set autoRotation to true and allow it to gradually change speed as it spins?
It seems that you have to set the speed before the autoRotation starts, and that changing the speed while autoRotation is doing its thing doesn’t affect anything.
You can not change the speed while rotation is in the middle betwen two elements. New speed will be applied only for the next rotation.
for example if you have three elements in carousel, and you are changing the speed when the carousel in the middle between 1 and 2 the the new speed will be taken for the next animation – between 2 and 3. You can not change animation speed if it is in progress.
how to display your ‘panel carousel setting” like in your demo ?
I downloaded your archive but I don’t see this panel…
Thanks for help.
In fact, I can get jquerry script in your demo (carousel setting) but where to put the code in your examples files ? Same thing with AngularJS tag ?
Thanks for help
Also, in your example http://theta-carousel.com/carousel-example.html#example=bezier2, is possible to create custom link for each slide ?
AngularJS tag is applicable only if you have angular application. It’ll not work without Angular JS. If you have Angular JS app, then just put this tag into your HTML. See AngularJS folder as an example.
Yes, you can add custom link for each slide, to do this you should modify the content of
tags. You can put there the links, which you want to display within your carousel items.
Hope it will help.
Use, by you or one client, in a single end product which end users are not charged for. The total price includes the item price and a buyer fee.
Use, by you or one client, in a single end product which end users can be charged for. The total price includes the item price and a buyer fee.
View license details
Get it now and save up to $6.50
Deliver better projects faster. Photos, templates & courses
Unlimited downloads. Only $29/month
Learn almost anything with
Envato Tuts+ for free
9000 free tutorials, 3000 paid courses
Designers matched perfectly to
you on Envato Studio
2000 artists ready to undertake your work