Im using Slick Slider and the Slider Syncing option. Is it possible to scroll the "thumbnails" (.slider-nav in the example) without changing the main image (.slider-for in the example)?
I only want the main image to change when you click on a thumbnail. This way you can scroll through all the thumbnails and when click on the one that you want.
http://kenwheeler.github.io/slick/
It looks like there is no option for this on the slick slider docs but there is jsfiddle example that works for me:
- http://jsfiddle.net/Virtual/webyrb9d/
Related
Is there any way to highlight the area with overlay like below image? I need to show like this tooltip for the users who are using the app first time.
Live site is here: www.wiivv.com
Here's a video of the issue: http://imgur.com/a/JEFne
On mobile, buttons are skipping around when you scroll. I think the issue may have something to do with Slick Carousel.
How would you troubleshoot an issue like this?
Looks like Slick is adjusting the height of your slideshow div according to the device you are using. It doesn't know to adjust the height for your second button.
The height adjustment to the div is usually done via Javascript. You can adjust the JS code to suit your buttons or put some CSS media queries in place to override what the JS is putting on your div.
I have an button, and I told it which 'image' to use (setting the image in 'background' works too). I would like to make the image inside the button to be smaller than the button. I tried changing the content insets, the title insets, and the image insets, but none of them seem to be working. The content and image insets scoot the image around, but do not make it smaller.
I would like to accomplish this in the main.storyboard, and not do it programmatically, if possible.
Not the best solution but if you need any easy work around you can add the image as an UIImageView and then add a clear button over it with the padding u need
I am currently using the Image control in XAML, when the user taps on the image I want to display another image like a tap effect*, so for example I want to make the image a bit darker or lighter once the user taps on it, how can I do this using the image control?
I've managed to fix this with adding a new image to the mousebuttonup, mousebuttondown and mouseleave event of the image control
You could place a collapsed image with the same size at the same position as the first one. If the user taps the image, you show the previously collapsed image.
If you want to make your first image darker, set the background of your hidden image to black and opacity to 0.25 or something like this. When it gets visible your first image will be slightly darker.
Instead that you can try to customize the style of your button. In Visual State>>Pressed>>You can change the Color or you can give some animation as well.
tHANKS,
I have a site at present built using magento and using magic zoom for product images, the plugin works fine for desktop versions and on most responsive designs, however on some screens, most iphone4s, the image takes up the whole top half of the screen and I can't scroll using my finger if I press on the image.
Is there a way to conditionally add CSS and js files based on screen size?
Any help would be appreciated.
I think the easiest way is to put some check if it is mobile in that script.
for example:
if (jQuery(window).width() > 767) {
// here should be the code from magic zoom
}
That means it will show the code from Magic zoom only if window width is bigger then 767