HTML5 Parallax Slider 2 Support Product Page

Answered

Can you have a 100% width slider that is responsive?

Asked 11 Jan 2016 22:04:32
3
have this question
11 Jan 2016 22:04:32 Brad Lawryk posted:
I need to create a slider that is 100% width and responsive. I am using Bootstrap if that makes a difference.

Can it be done? If so can it be set to only resize the width and not the height?

Replies

Replied 12 Jan 2016 17:09:17
12 Jan 2016 17:09:17 Brad Lawryk replied:
So apparently it is not responsive. Actually I see exactly zero differences between this extension and the previous version except for a 2 added to the name. Well, that was a waste of money.
Replied 12 Jan 2016 19:24:31
12 Jan 2016 19:24:31 Teodor Kuduschiev replied:
Hello Brad,
Responsive design does not always mean that the elements are fluid.
A responsive site can be created without using a single fluid element. The slider by default is not fluid, but it can be easily used in responsive layouts (check the video tutorial showing this please) using media queries, integrated in the bootstrap framework.

If you need a fluid width slider you can use the HTML5 Browser properties extension, and the slider width to be as wide as the viewport size (check the last showcase from today).
Replied 14 Jan 2016 03:55:28
14 Jan 2016 03:55:28 Brad Lawryk replied:
Hi Teodor,

Can you point me to the Showcase you are referring to? And is there a tutorial video for it.

I did see the video. Unfortunately the video calls for using the Bootstrap Extensions. I cannot use the Bootstrap Extensions. They cause nothing but problems when using includes and working on sites that were not originally made with the extension.

The Bootstrap Extensions always Hijack my Bootstrap sites causing so much problems.

Also is there a list of what is new in this version? Seems exactly like the old version except the name.
Replied 14 Jan 2016 09:22:05
14 Jan 2016 09:22:05 Teodor Kuduschiev replied:
Hello, the latest showcase can be found in the showcases section, on the product page: www.dmxzone.com/go/32236/html5-parallax-slider-2

Also for the Bootstrap 3 Extensions what exactly do you mean by: "They cause nothing but problems when using includes " ?

What do you mean they "hijack" your Bootstrap pages? This seems to me like you did not properly use the configure Bootstrap 3 Options. You should disable the automatic file update option and just browse to your custom bootstrap css file:

DMXzone Bootstrap 3 works perfectly with custom Bootstrap pages and with pages created DW integrated Bootstrap.
Replied 14 Jan 2016 14:33:22
14 Jan 2016 14:33:22 Helen Eichel replied:
I also cannot get the slider to be 100% wide. The slider only seems to allow for a fixed width.

Your example - www.dmxzone.com/go/22016/web-agency-showcase - has a 100% div with a background image, and the slider has a fixed width within, with no background images.

I would like the slider to be 100% wide, with each slider (data-slide-title) having it's own background image, so it can span 100% wide.

Is there something I can change in the code to allow for a 100% wide slider, that includes the background of each slider changing? Thanks.
Replied 14 Jan 2016 18:03:54
14 Jan 2016 18:03:54 Brad Lawryk replied:
Thanks Teodor,

The biggest problem with the Bootstrap extensions is it requires the Bootstrap Page extension for the other extensions such as the elements to work. So when I use Bootstrap extensions with includes it has to include all the head content on very page and sub page.

This adds a lot of duplicate and conflicting code such as and especially the link to the jquery.js files. If you have more than one on a page then none of them work. So if I have a page with ten includes on a page I have to manually delete head code on all those pages all the time.

The bootstrap extensions are good extensions, just don't fit my workflow at all, and not really the topic of this thread though. ;-)

Back to this topic ...

Is there a tutorial for that showcase?

And ...

Why are you avoiding the question about what is new in this version of the Parallax Slider other than the name? :-)
Replied 18 Feb 2016 20:38:16
18 Feb 2016 20:38:16 David Woolley replied:
It's a lot of work setting up the sliders for the 4 device sizes.
So each image has 4 different sizes to match each container width.
Then the element layers on each slide have to be repositioned and resized 4x.
I can't keep track of it all! Am I missing something?

There has to be an easier way ...
Replied 18 Feb 2016 20:43:06
18 Feb 2016 20:43:06 Brad Lawryk replied:
At this time it has to be done that way as it uses absolute positioning. I have decided to simply not use the slider on phones as it is too small and uses extra bandwidth and load time on devices that may be using a data plan.

Reply to this topic