FAQ Database Discussion Community


image slider with previous and next image visible

ios,objective-c,uiscrollview,slider,image-gallery
What I have is list of images. I was showing those images in scrollview with paging enabled. Now client came back asking too show next (partly visible), current (fully visible) and previous (partly visible) images as shown in below image. What I tried is as below. int mm = 150;...

Go to slide based on data attribute in Slick Slider

javascript,jquery,slider,slideshow,slick
Some slides in my slick slider have data attributes such as this: data-artwork="unique-id". What I'm trying to do is when you hover over a menu item it will slickGoTo a slide based on the data-attribute. The menu items have matching data-attributes like this: <ul class="project-feed"> <li data-artwork="unique-id"> <a href="#">Example</a> </li>...

Jquery Image slider not looping

jquery,image,loops,slider,radio-button
I am having a problem with some of my JS. I have an image slider which automatically scrolls through the images, and an image can be selected using radio buttons, but the images will only play through once and then stop. This JSFiddle works best in chrome - https://jsfiddle.net/jw09363f/ Here...

BxSlider—Click Slide for Next

javascript,jquery,slider,bxslider
Instead of using prev/next controls, I'd like to turn the slide itself into a next button. Pretty straightforward functionality, but I can't seem to figure it out. This is what I have: $(document).ready(function() { $('.bxslider').bxSlider({ adaptiveHeight: true, easing: 'cubic-bezier(0.600, 0.060, 0.500, 1)' }); $('.bxslider').click(function() { slider.goToNextSlide(); return false; }); });...

How to show current position of a slider over the thumb always

wpf,slider,tooltip,thumb,alwayson
How to show a slider control with a tooltip/label under the thumb showing the value (timespan) always while it moves with/without user dragging. I tried AutoToolTipPlacement="BottomRight" AutoToolTipPrecision="3" on my slider. But Tooltip gets displayed only when i drag the thumb. I want that shown even when i invoke playing slider...

My bootstrap carousel code doesn't work

slider,bootstrap
I'm trying to make a slider and it's not working i think there is something wrong with my buttons, can someone tell me why?? I'm new at this so i don't know what's wrong.... This is my code: `<head> <link rel="stylesheet" href="bootstrap/css/bootstrap.css"> </head> <body> <div id="carousel-example-generic" class="carousel slide" data- ride="carousel">...

Event that triggers when slider changes value, but mouse button is not yet released

javascript,jquery,html5,slider
I have a slider on my page using standard html 5: <input type="range" min="0" max="100" step="10"/> When the user changes the slider value by dragging it left or right, the javascript/jquery change effect doesn't trigger until the user lets go of his mouse button. I would like to know how...

WPF: why my slider not show the minimum value on my label

wpf,slider,styles
<Grid Margin="405,192,170,450" > <Slider Name="speedSlider" Value="1" Style="{StaticResource SliderStyle}" HorizontalAlignment="Left" VerticalAlignment="Bottom" Minimum="0" Maximum=" 50" TickFrequency="5" TickPlacement="None" Width="160"/> <Label Name="lblSliderSpeed" Content="{Binding ElementName=speedSlider, Path=Value, UpdateSourceTrigger=PropertyChanged}" Grid.Column="1" VerticalAlignment="Bottom" HorizontalAlignment="Right" ContentStringFormat="{}{0:#}"/> </Grid> My label show the current slide...

How to store slider values in a vector

arrays,matlab,vector,slider,value
I'm using Matlab to create a GUI. Herefore I'm using the guide function of matlab. I want to store the slider values in a vector. I am doing this in the callback function: for i = 1:10 X(i) = get(handles.slider1,'Value'); end But this results in a vector that stores the...

Range style with values

html,css,html5,slider,datalist
I want a slider using HTML5 like this where I can display the value. I have tried the below code: <input type=range min=0 max=100 value=50 step=1 list=tickmarks> <datalist id=tickmarks> <option value="0 to 20">0</option> <option>20</option> <option>40</option> <option>60</option> <option>80</option> <option>100</option> </datalist> But nothing seems to work. Any Idea?...

Slider overflow responsive

javascript,responsive-design,slider
I'm working with this slider, all works great but why on small screen (less than 480) or on responsive view it don't run?! how can i fix this problem?! More details in the fiddle below http://jsfiddle.net/roXon/tMxp5/1/ $(function() { var c = 1, timeOut, fit, isStopped = false, boxw = $('.box').outerWidth(true),...

Mathematica Dynamic List Design [closed]

dynamic,graphics,slider,wolfram-mathematica,list-manipulation
Suppose a dynamic list of 5 that if one changes, all the others would change correspondingly to keep the sum 1. It comes from a practical problem that 5 probabilities of a total of 1, if one of them changes (by Slider), all the others will also change in an...

JQuery simple-slider

javascript,jquery,slider
I have a jQuery simple-slider setup. The slider is working fine so far. Below is the code used to create the slider: <li id="amountSlider"> <input id="lending" class="slider amount" type="text" data-slider="true" data-slider-highlight="true" data-slider-range="1000,10000" data-slider-step="250" /> <p> <strong> £ <span class="output amount">1000.00</span> </strong> </p> </li> and <script src="/javascript/simple-slider.min.js" type="text/javascript" charset="utf-8"></script> I am...

WPF Cell Phone UI (sliding screens)

wpf,user-interface,slider,effect,cellphone
I'm looking for some advice on the best way to create a cell phone like UI (specifically the sliding screen part). This is for a system tray tool that I am developing for an IT support company. The WPF application looks like a cell phone, and contains various different buttons...

I want to display my text after my thumbnail slider div

javascript,jquery,css,slider,active
I want to display my text after my thumbnail slider div something like this, my active slider class: "itm0 selected" my thumbnail id: "thumbs" i want to display text below my #thumbs div automatically when it is active i tried this CSS, but not worked, .itm0 .selected{ #thumbs::after{ content:"first active...

I want to add a html5 slider to a webside instead of a flash slider that i have on my website

html5,insert,slider
I want to add a html5 slider to a webside instead of a flash slider that i have on my website but when i insert the html5 slider it does not show on the website i want to specific that the website was not created by me link download website...

WPF - Attaching a custom property to a slider

c#,wpf,slider,dependency-properties,attached-properties
In my project, I am currently creating a slider in my code-behind the view and this slider has an event for when it's value changes. The place where the slider is created also has a custom object that is required for this project. I wanted to have this custom object...

How to check if image url has been loaded with jQuery?

javascript,jquery,slider,thumbnails,jquery-load
I have this code here where I have a slider with thumbnails and the sliders large image takes it's next attr('src') from the click on a thumb, but I'd like to change that src only when the image has loaded. This is the source that I've come up with so...

Slider Not Excepting Current Default Value in Swift

function,swift,slider,calculator,updates
Sorry to do this again, but my code has yet ANOTHER problem. When I run the program in the simulator, if I move the slider from its default position and hit the submit button, it will calculate the mpg. However, if I leave the slider at its default position of...

z-index for button over jquery slider

jquery,css,button,slider,z-index
I have a full screen jquery slider and I need to put two buttons on it (to increase and decrease the speed of the slider). I tried with z-index in the css file but it's not working. div#lyr1 { position:relative; z-index:1; } .ui.button { ... position:relative; z-index:2;} And here's the...

jQuery Mobile Slider for dollar amounts

jquery-mobile,slider,jquery-ui-slider,jquery-slider
I am wondering if anyone knows how to modify the jQuery Mobile Slider to show dollar amounts? Or at the very least so show 2 decimal points at all times. i.e. if a user selects 10 I want it to show 10.00 instead of 10. With my current HTML below,...

Slidershow jquery and convert to css

jquery,css,html5,seo,slider
I downloaded script for slider show and it work without problems but after implemented this slide show i have problems with seo optimalization in HTML5. Because this code using this <div u=""> or <img u=""> and its still write me that i cant use this combination div with tag "u"....

metafizzy flickity select without the animation

jquery,slider
I am using metafizzy flickity. Is there a way to select an gallery cell without the animation? Unfortunately "initialIndex" doesn't seem to work after the init. Thanks for any tip, I couldn't find anything so far....

Align list item under list using css to create jquery slider

jquery,html,css,slider
I have the following code which create very simple slider. HTML: <ul id="slidebox"> <a href="#" class="control_prev"> << </a> <a href="#" class="control_next"> >> </a> <li class="slideholder"> <img class="imgstyle" src="http://bxslider.com/images/730_200/tree_root.jpg"/> <div class="slidetext"> <h3>headline1</h3> <p>news1</p> </div> </li> <li class="slideholder"> <img class="imgstyle"...

Slick Slider Next Arrows not showing

jquery,html,css,slider
I'm trying to get the next and previous arrows to show up next to the product slider, just like in the Slick Slider example. But my sample doesn't seem to load the appropriate fonts to make that happen. Here is my code: HTML <div class="slider"> <div> <img src="http://www.onguardapparel.com/images/products/thumb/8013LN_Cat.jpg" height="100" width="100">...

JSSOR Slider Min-Height change needed

slider,jssor
"jssor slider will always keep aspect ratio while scale. so min-height is not reasonable" hi all, i need a min-height function for the image in order to keep my page layout consistent. Does anyone know how to modify the js code? A flexible dynamic width is good but at...

Adding navigation buttons below my slider

javascript,html,css,slider,carousel
I created a fade slider with images, text and links. I'd like to add some navigation bullets below it to control the images. like this : http://www.parallaxslider.com/preview_images/skins/bullets_skin.jpg Here is the slider code: html <div class="slides"> <div class="slidiv"> <a href="..." ><img src="..." > <span> text1 </span></a> </div> <div class="slidiv"> <a href="..."...

Basic image slider plugin with nav buttons

javascript,jquery,css,slider
I am trying to implement a simple instance of the unslider jquery plugin with nav buttons enabled and auto play disabled. I looked through the documentation and the below seems like it should do the trick. However, the buttons never appear and autoplay seems to be enabled by default. I...

Add captions to image slider

javascript,jquery,html,css,slider
I'd like to add captions to the bottom left corner of this slider but I'm not really sure how to do it. Ideally, text should NOT slide like the images. It should behave like this. I've tried using that plugin but honestly it seems overcomplicated and this script is working...

Javascript - negative decimal input range with non-linear scale

javascript,slider,logarithm,exponential
I have an input range slider that ranges from -1000 to 1000. <input type="range" min="-1000" max="1000" value="0" /> I want the steps to be non-linear (either log or exp) with more precision in the lower range. So for e.g. -1000 -999.5 -998 -996 ... 0 100 300 600 1000 Doesn't...

ReactElementExtended.js:30 - Error when integrating “React-Slick” ReactJS Module

javascript,slider,reactjs,carousel,slick-carousel
When I integrate react-slick ReactJS module into my project I get the following error in Chrome's console. What does this error message mean? Did I integrate the module incorrectly? <error>ReactElement.createElement @ ReactElementExtended.js:30ReactElementValidator.createElement @ ReactElementValidator.js:396React.createClass.render @ Slider.js:26ReactCompositeComponentMixin._renderValidatedComponentWithoutOwnerOrContext @ ReactCompositeComponent.js:775ReactCompositeComponentMixin._renderValidatedComponent @...

Within a slider, the active slide fades out, but the next slide doesn't fade in; it just appears.

jquery,slider,carousel,fadein,fadeout
How can I make the effect smoother so that the next image fades in instead of just appearing? The active slide fades out, and then the next one appears after the first slide fades to white. This doesn't look very smooth or elegant, and I would like to have the...

CSS Slider's Tab's Active Class (Bootstrap) doesn't work on second slide

css,twitter-bootstrap,tabs,slider
I am using a CSS Slider that utilises two sub tabs in each slide. The slider's sub tabs use Bootstrap's 'Active' Class on the li that then changes the inactive li's class to active when the inactive tab's navigation arrow (< or >) is clicked. The sub tabs work correctly...

Basic Jquery Slider Modifications

jquery,css,slider
I just downloaded the Basic Jquery Slider, and the problem is I would like to modify it to the following specs: 1, images would be iPhones. 2, instead of displaying 1 image slider will display 3 images with the two outer images faded outward gradient. 3, when you click on...

Resolve conflict with navigation slider in javascript

javascript,slider
I'm currently building a small slider in Javascript which is working pretty well (almost) but I have an issue ! You will find here the codepen link : Slider Line 22, 32, 38 I have my two navigations supposed to add a class active (after remove) but I have a...

Q: Jssor account for body padding in Scalewidth

jquery,slider,jssor,calc
I am running into some responsive problem with the jssor slider. I get an overlap on the right side which also gives a horizontal scrollbar. I think it's because of the scalewidth percentage, if i lower this percentage with 0.03 it looks good. I am using a body padding of...

Angular-material: Remove dots in discrete md-slider

angularjs,slider,angular-material
While using md-slider from angular-material, if the range of max and min is less, then the slider is looking fine: However if the range of value is wide (1-100) then the pink line of the slider is getting overlapped by grey dots: Is there a way to remove these grey...

Why the slider image is not responsive?

css,slider,responsiveness
The problem seems to come from the ul.gallery with that width of 20000em. Even if the rest of the divs are resizing, the images are not. here a live test; (edit: removed link) Any help please? #container div.school { background: white; color: #333333; float: left; position: relative; overflow: hidden; max-width:...

Slider toggle works in jsfiddle but not live

javascript,jquery,slider,slidetoggle,jsfiddle
As title states, I made a slider that works in the Jsfiddle preview, but not live. Here is a link to the fiddle: http://jsfiddle.net/kits87/99tz8w2c/16/ Here is the javascript as I put on my site: $(document).ready(function() { var $div1 = $('#work'), $div2 = $('#play'), currentDiv = 'play', $button = $('button'); $div2.hide();...

Putting line marks on Slider

java,javafx,slider
I Want to put line marks like the image below when I make a right click on the slider. Can this be done with javafx Slider? If yes, then how? ...

Controlling canvas object with range slider

javascript,canvas,slider
Attempting to place a circular object on a canvas, and alter the position of the object dependent on range slider inputs (x, y). Currently the object is not placed on canvas, rather than the var cx/cy being a number value they are being returned as [object HTMLInputElement]. Why? JS code:...

Use XAML StringFormat to get one decimal place

wpf,slider,shape
I have this Circle Slider: And this is my TextBlock inside: <TextBlock Text="{Binding Path=Value, ElementName=knobSlider}" Foreground="White" FontFamily="Trebuchet MS" FontSize="20" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.7,2.478" Margin="59,100,44,26" Width="47" /> How can i convert the Slider value from double to only one decimal place and put this text in the middle of the circle ?...

bxSlider WP Pro Multiple themed pagers

css,wordpress,slider,bxslider,pager
I bought bxSlider WP Pro. Everything is working fine. I just want to create several pager templates. Let's say I have a slider on the front page with blue pager and I have a slider in an inside page with red pager. Any ideas of how to do that? I...

Slider doesn't autostart in Explorer 11

slider,internet-explorer-11,jssor,autostart
I have been unable to get this code to work on IE11 - it works fine on Chrome and Firefox, Android Chrome, Opera, just not IE. In IE11, I can actually see the images pile in on top of one another until it reaches the last image, then it just...

jQuery Mobile ranger / slider refresh not working

jquery,user-interface,mobile,slider,refresh
I am developing a mobile app based on HTML5 & CSS & JS, powered by jQuery mobile. I am creating a form programmatically. I use text fields and rangers (slider). After creating this inputs they aren't styled. No problem. For refreshing textfield style, I use: $(selector).textinput(); .. and all works...

jssor sliders swipe in the same time

slider,jssor
I have two Jssor "nearby-image-partial-visible-slider" on the same page and I would like them to swipe/move in the same time. Is this possible? Can somebody tell me how can I achieve this? Thank you!

How I can make my jquery Flexslider move automatically?

javascript,jquery,slider,opencart,flexslider
I am having trouble with the built-in slider in this theme: Eda Opencart Theme I relised after purchase that it doesn't move automatically. Is there a way to change the javasript code to make it move eevry, let's say 4 seconds? That's the code: /* * jQuery FlexSlider v2.2.0 *...

HTML Carousel not registering

javascript,jquery,html,slider,carousel
I am trying to get my carousel to function, but when clicking on the arrows, the slides don't change. This is my code, http://codepen.io/rkrc/pen/ogPaqM HTML: <div class="slider"> <!-- picture 01 --> <div class="slide active-slide"> <div class="container"> <img src="image"> </div> </div> <!-- picture 02 --> <div class="slide"> <div class="container"> <img src="image">...

Navigation for slider by checkbox

jquery,checkbox,slider,radio
Continuing experiments with my own slider. Now making nav arrows. So Im asking how to make it work? I’m using next()/prev() to make next/prev input checkbox to be checked. But next()/prev() isn’t working. Why? Here is the code. $('.to-right').click(function(){ $('input[type="radio"]:checked').next('input[type="radio"]').prop("checked", true) }); $('.to-left').click(function(){ $('input[type="radio"]:checked').prev('input[type="radio"]').prop("checked", true) }); ...

Is it possible to make the Unity3D UI slider that follows a timeline?

c#,time,unity3d,slider,unityscript
Basically is it possible to create a slider that works like the slider present in youtube videos with the pause and play button. The concept for me is to link the slider so that it moves according to a timeline. The play and pause buttons would then just be used...

How to display inverted vertical slider?

java,javafx,slider,javafx-8
How can I invert a vertical slider control so that the minimum is at the top, and the maximum at the bottom? If I rotate it by 180 degrees about the z-axis then it unfortunately inverts the text in the labels too. I'm aware of an ugly workaround I can...

Jquery UI slider values in handles not showing up?

jquery,jquery-ui,slider,handles
I'm trying to put time values in the slider handles of this jquery-ui slider and can't figure out why the values aren't printing inside the label / handles. Below is a fiddle: http://jsfiddle.net/kirkbross/194d00fm/ $("#time_range").slider(); ...

How can I add content inside of my FlexSlider?

html,css,slider,flexslider
My original FlexSlider markup: <div id="flex" class="flexslider"> <ol class="flex-control-nav flex-control-paging"><li><a class="flex-active">1</a></li><li><a class="">2</a></li><li><a class="">3</a></li><li><a class="">4</a></li></ol> <ul class="slides"> <li> <img src="assets/img/bg-1.jpg" alt=""> </li> <li> <img src="assets/img/bg-1.jpg" alt=""> </li> <li>...

what type of slider is perfect for responsive website? [closed]

jquery,css,slider
I have seen many well known sites like https://www.airbnb.com/ which are using responsive slider. This slider is very light and perfectly responsive. I have used Camera slider and layer slider (both static and wp version). These slider either take too much time for loading at start or they don't get...

Slider Trasform button into arrow

html,css,button,slider,arrow
Could I trasform the button of this slider into two arrows "Next - Previous" ?! In this case i have a button for each slide, i had to use only two button, but how can i transform input in next and previous?! with a simple js or i could fix...

How to remove left/right nav buttons from the super.simple.slider

javascript,jquery,html,navigation,slider
Hello I have a grid layout with sliders in most of the squares. As you can see below I have two parts to my jquery as I have two different sliders with 2 different effects. In one of the sliders I want to turn off the Nav buttons which I...

Appending an HTML div inside another div

javascript,jquery,html,css,slider
I would like to add another div within a div group on a button click in order to have a continuously generating slider. Like so: <div class="carousel-items"> <div class="date-carousel-other slider"></div> <div class="date-carousel-other slider"></div> <div class="date-carousel-other slider"></div><!-- new div --> </div> Currently my java script is: $('.slick-next').click(function(){ $('"<div class="date-carousel-other slider"></div>"').append( ".carousel-items"...

jquery image slider not sliding?

javascript,html,image,slider
The blueberry Image slider isnt sliding, here is the java script code please help me modify or add enough code so that it will work properly. I have linked the blueberry.css and jquery.blueberry.js files too btw. thank you - student of web development <meta charset="UTF-8"></meta> <title>Rose Street | Auto Repair</title>...

Formula for output value given a restricted range of input - Slider UI

algorithm,math,slider,formula,uislider
Given these parameters: minX = 10.0 maxX = 200.0 minY = 300 maxY = 700 The user can move x between minX and maxX. Find y so that it is the same proportionally between minY and maxY as x is between minX and maxX. So if x = 10, y...

Responsive slider javascript

javascript,slider
I am trying to create a responsive slider. I have searched for many horizontal slider examples and found this one to be the most straight forward and simple. Now I want to adapt the code to make it responsive. When the slider is for example on 2013 than something should...

Responsive website - slider content with images does not fit in mobile viewport

html,css3,mobile,responsive-design,slider
I have a website http://www.vinjerac.com which has an image slider. The complete site is responsive, but the slider content does not fit the viewport in mobile devices and the website looks distorted. Can you please suggest a solution for the same. Thanks...

Carousel slider to be displayed

slider
I want the carousel slider with the 3rd image to be half displayed and on click the right side navigation icon the 3rd image need to be displayed first and rest 2 images need to be displayed

jssor slider missing content in IE but ok in Chrome

jquery,slider,jssor
I have created a simple slider using jssor, and it works fine in Chrome. However, when I view the same slide in IE 11, the text is missing (but the background image is present). Can someone tell me what is wrong with this code - why won't the text show...

Average of 4 slider values

javascript,jquery,html5,input,slider
I'm trying to get the average of 4 simple input sliders. I want to show the average value in a textfield. I'm pretty sure I need to use javascript/jquery. But i'm not very familiar with it, so I could need som help. I'm pretty sure it is very simple, but...

trying to solve this bug in jquery slider controls

javascript,jquery,slider,slideshow
I've been trying to figure this out for many, many hours. I'm having an issue where the indicators on this jquery slider will stop changing opacity if you click on them after the slideshow has looped. Furthermore the first indicator doesn't seem to be changing opacity at all when you...

Embedding JSSOR slider

javascript,jquery,css3,slider,jssor
I am trying to embed the slider into my site, but I am getting the white squares stacked 3 high (3 different slides) when I test it. I am new with javascript and clearly missed something. I wanted there to be a slider with 3 slides that could be clicked...

jQuery Simple Slider not setting the values for both text boxes

jquery,slider
I am following the tutorial jQuery Simple Slider Examples My index.html goes as under <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script src="js/simple-slider.js"></script> <link href="css/simple-slider.css" rel="stylesheet" type="text/css" /> <link href="css/simple-slider-volume.css" rel="stylesheet" type="text/css" /> </head> <body> <h1>Home Loan EMI and Eligibility Calculator</h1> <table...

Using Kenb (Ken Burns) Slider on WordPress - How to make slides load in random order

javascript,wordpress,slider,wordpress-theming,slideshow
I'm using the Kenb effect slider on WordPress. I would like the slides to load in a random order. Is that possible? I think this is the relevant js below. You can also see the site at: http://goo.gl/yBGZAk (function($){ $.fn.kenburns = function(options) { var $canvas = $(this); var ctx =...

JQuery UI slider setting multiple input values

jquery,jquery-ui,input,slider,value
I am trying to get multiple values to change while sliding the JQuery UI slider. Basically changing 3 different values based on the slider's number. In this case I'm using a range of $100,000 to $2,000,000. Then I want to calculate 3 different values depending on the position of the...

jQuery UI slider labels - follow handles on resize

jquery,jquery-ui,slider,position
I'm using labels to display handle values with jQuery UI slider. How can I maintain the position of these values on resize? Here's a fiddle: http://jsfiddle.net/kirkbross/vc8tumg9/3/ $(label).html(hours + ':' + minutes).position({ my: 'top center', at: 'bottom center', of: ui.handle, offset: "0, 30" }); For extra credit... can you tell me...

Cannot add Button in second child in Sliding up Panel

android,nullpointerexception,slider
I have a sliding panel in my Layout. There is a button in first child which works fine but when I add a button in second child there is a NullPointerException thrown. If I remove the Button layout works just fine. I am not able to understand what I am...

JSSOR Slider Number Bullet List

slider,jssor
I am using Jssor slider and works fine in default. But I don't use bullet images. Is that possible use number instead of bullet images? My bullet parameter is u="navigator" Thanks in advance...

Slider progress bar with MediaElement Windows Phone 8.1

c#,xaml,slider,windows-phone-8.1,mediaelement
I am working within a Windows Phone 8.1 (non SilverLight) application. I have a MediaElement AudioPlayer that plays audio files. I also have a Slider AudioPlayerSeek that I want 'hooked' to the MediaElement, so that it moves as the audio is playing. I have gone through this tutorial word for...

Stop code executing when clicking an item

javascript,jquery,slider
I'm trying to create a slider that executes when users scrolls close to a specific element. The code uses setTimeout to move from step to another one. The problem is that if user clicks .trigger, the code runs through the last steps and messes up the slider. JS: / Footer...

Foundation Range Slider Cannot Impose Limits

javascript,jquery,slider,zurb-foundation
I currently have a screen that can have multiple range sliders on it. Each slider has a total range of 0 to the maximum the combination of sliders can have. For example start: 0; end: 20; Within my application I would like to set some limits for the values a...

Parent div of specific height and width containing number of child div horizontally

html,css,css3,slider
I have parent div(slider) of height:450px and width:960px, which have random number(here let us consider 5) of child div(pannel) of same height and width. They must be arranged horizontally inside parent div, such that only one div fits parent div at a time, also only overflow-x:auto; no vertical scroll bar....

Leaflet slider group by year

jquery-ui,dictionary,slider,gis,leaflet
I'm using leaflet slider - https://github.com/dwilhelm89/LeafletSlider - but I can't get the desired result, even if from the plugin description it seems it can do. I have a collection of features, geometry type is polygon, where I've inserted a property "time" as requested by the plugin. I've tried bot with...

How can I create a slider to change a color?

javascript,html,slider
Essentially, I am trying to take a value, defined by a slider on the interface, pass that value through an array to choose a colour, and pass that color through to a function containing a fill.style. I have a rough idea to have a go about this, but it isn't...

I need my jquery slider to auto play

javascript,jquery,slider,autoplay
I have a jquery slider from http://tympanus.net/codrops/2013/02/26/full-width-image-slider/ I have installed the slider perfectly and its working fine, I need it to slide automatically when a user visits the website. I have no experience with jQuery and I'm unable to get this to autoplay. Here is the jQuery code for the...

PKReveal Controller UIVIEW unrecognized selector sent to instance

ios,xcode,uiviewcontroller,slider
Ok I've tried REALLY hard to look through all the other posts about PKRevealController and figure this out... but it's just not happening so far. so here's what I've got: AppDelegate.m ViewController *viewController = (ViewController *)self.window.rootViewController; UIViewController *leftViewController = [[UIViewController alloc] init]; leftViewController.view.backgroundColor = [UIColor redColor]; PKRevealController *revealController = [PKRevealController...

Jssor slider variable width based on window width

css,slider,styles,width,jssor
It is possible to change slides to fixed width based on window size (media queries)? I don't want it to scale or be in percetange, just fixed width depending on window size. For example something like this @media screen and (min-width: 320px) { .slides { width: 200px; } } @media...

jquery accordion menu animation transition

jquery,css,animation,slider,accordion
I am looking for a tutorial on how to reproduce an effect very similar to www.outdatedbrowser.com I really like the way it animates and navigates. Does anyone have any pointers. Much appreciated, Cheers, Greg....

Dynamically adding slide images inside slider

javascript,jquery,slider,owl-carousel
i am trying to dynamically add images in the slider called owl slider. The problem is that i want to clear the divs inside the .owl-wrapper div and then add new items on a click. The original code is <div id="owl-demo" class="owl-carousel owl-theme"> <div class="item"> <img src="../img/car1.jpg" alt="The Last of...

Jssor Thumbnail Navigation Doesn't Slide/Drag

javascript,jquery,slider,jssor
We are implementing a Jssor slider on our website. Everything was working good, but while we were adjusting for design and images the thumbnail navigation stopped moving. The page is here: http://visionsunltd.com/CMS/advertising-gallery <script src="http://visionsunltd.com/js/jssor.slider.min.js"></script> <script> jQuery(document).ready(function ($) { var _SlideshowTransitions = [ //Fade in R {$Duration: 2000, $During: { $Left:...

jQuery slider with fade not changing image

jquery,css,slider,fadein,jquery-slider
Am trying to create a simple JQuery Slider. And each time only one picture should be visible. And after x seconds a new image shoud fade in. Only the problem is that the images are not displayed and lingers at the first picture. Maybe someone can help me with this....

slickGoTo wont work during animation

javascript,jquery,html,slider,slick.js
I am building a slider with slick than is 10 sliders. Each one is a slice of a horizontal slide of an image. If one of them is clicked then they should all slide to the same random index with slickGoTo. However if a slide is currently being animated that...

How to keep sliding website on page while lightbox is open?

javascript,slider,lightbox
Code: http://cssdeck.com/labs/xpwki4sy Is there any way to keep the main website on slide two when the lightbox is open? Currently the main slider page shifts when you flip images in the lightbox using the arrow keys, there is no problem is the arrows within the lightbox are used....

create image slider like youtube channel

javascript,jquery,css,image,slider
i was wondering how can i create image slider like YouTube channel. when there is many video on a channel YouTube put them in a slider and we have back and forth button to see other video which doesn't show on the page and when we click on this back...

Jquery change function on ionslider not working

jquery,slider
I have a ionslider in my project. I need to predict the slider change. This is my slider $("#myslider").ionRangeSlider(); on change function $("#myslider").on('change',function(){ var $this = $(this), from = $this.data("from"), to = $this.data("to"); console.log(from + " - " + to); }); But 'change' function not working. Is this a correct...

Sliding Form in JavaScipt [closed]

javascript,jquery,html,forms,slider
I'm looking to create a signup form that works like a jQuery slider, showing one input at a time and then allowing the user to submit the form whilst sliding between each input. I've been looking around online but found nothing of use, but did spot something similar to what...

Get the height of the next or previous hidden element to set height of the parent element. jquery

javascript,jquery,slider,carousel,hidden
I have a ul which contains images which are hidden and then loaded into a carousel using absolute positioning. The height of these images is constrained in desktop view so I can control the height of the parent element as there is a small toggle menu below the ul. When...

images from database not getting loaded in Jssor Slider

javascript,image,slider,loading,jssor
Hi I am working on integrating JSSOR slider with my database images. I added code in my index.html. <div id="slider1_container" style="position: relative; top: 0px; left: 0px; width: 600px; height: 327px; background: #fff; overflow: hidden; "> <!-- Slides Container --> <div u="slides" style="cursor: move; position: absolute; left:50px; right:20px; top: 50px; width:...

issue in loading array of images from database into jssor slider on Page show event

database,dynamic,data,slider,jssor
I am working on JSSOR Slider for an array of images from database. 1) Is there any restriction that the "slides div" must have at-least 1 div inside to initialize.As i am getting this error on my iphone as i launch the app 2) Also upon page show i am...

Stop pausing when mouse hover -Full Slider

javascript,slider
I used Full Slider (https://github.com/IronSummitMedia/startbootstrap-full-slider) for my recent web development project. It is a background image slider. Now my problem is, when the user brings his/her mouse on to the web site, slider stops at the current slide because the slider is Full Screen. I want to stop this (this...

How to join setInterval and .on(“click”) function together?

javascript,jquery,html,slider,setinterval
I have an extremely primitive slider using fadeIn, fadeOut and some control bullets. https://jsfiddle.net/c2dsnr8v/1/ <div class="view"> <ul class="list"> <li class="frst"> <img src="http://www.guessthelogo.com/wp-content/uploads/2012/11/random-dice.gif" /> </li> <li class="scnd"> <img src="https://avatars.yandex.net/get-music-content/a19fc9b4.a.1767585-1/200x200" /> </li> <li class="thrd"> <img src="http://randomacts.channel4.com/images/fb_logo.gif" /> </li> <li...

WPF add new Slider style cause XamlParseException

wpf,slider,styles
i found this slider style that i want to add. i added all the 3 styles inside my Window.Resources and also put in the first style the 2 templates: <Style TargetType="{x:Type Slider}"> <Setter Property="FocusVisualStyle" Value="{StaticResource MyFocusVisualStyte}" /> <Setter Property="SnapsToDevicePixels" Value="true" /> <Setter Property="OverridesDefaultStyle" Value="true" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type...

Jquery slider auto again after finish

javascript,jquery,animation,slider
I´m new in Jquery and I need to help with this. I have Jquery image slider on the web page with rotation of few different images with timer 3000 per each image - they still repeat. Under the slider I have simple loader bar - based on other color hidding...

Onclick slider in pure JavaScript - event doesn't changes CSS value

javascript,html,css,slider
Im trying to make some kind of slider in pure JavaScript (I can't use jQuery or other frameworks because it is for eBay). I have function like that: var slider_moves = 0; var imagecount = document.querySelectorAll(".slides_gsc > img").length; var slide = document.getElementsByClassName('slider_img_width').offsetWidth; function slideLeft(){ if(slider_moves < imagecount -1){ document.getElementsByClassName("slides_gsc").style.right +=slide;...

Fade In and Out two images [JavaScript]

javascript,html,image,button,slider
I'm trying to make a simple slider using 2 buttons and fade effect. Everything should be working but it's not. What's wrong with my code? @Edit: I've posted all my code. I tried to do it with CSS but didn't work. I've tried keyframes, transitions and JS animations. $(window).scroll(function(e){ $el...

Using rangeslider.js for an HTML5 audio time scrubber

javascript,jquery,html5,audio,slider
I am digging into the finer points of Andre Ruffert's rangeslider.js and I am having difficulty into incorporating his code into controlling and reacting to a simple HTML5 audio element. I see that you can programmatically change the value of the slider with the click of a button, but how...