responsive rotating banner - how?

This section is for posting questions which are not directly related to WYSIWYG Web Builder.
Examples of off topics: web server configuration, hosting, programming related questions, third party scripts.

Note that these questions will generally not be answered by the administrators of this forum.
Post Reply
longman
 
 
Posts: 100
Joined: Sat May 19, 2018 1:23 pm

responsive rotating banner - how?

Post by longman »

Hi guys,

I was able to have a rotating banner by using the following code in the HTML:

Code: Select all

<script type="text/javascript">
function banner() { } ; b = new banner() ; n = 0
b[n++]= "<a rel='nofollow' href='www.domain.com'><img src='www.domain.com/image1.jpg'></a>"
b[n++]= "<a rel='nofollow' href='www.domain.com'><img src='www.domain.com/image2.jpg'></a>"
i=Math.floor(Math.random() * n) ;
document.write( b[i] )
</script>
But I need my image to be responsive, to shrink when the browser window gets smaller. I can make a none-rotating standard image responsive by going to Flexbox > Flex shrink > add 1 value. but how do i do it with the images inside the above HTML code?

I selected the HTML, in its Flexbox I added 1 value for Flex shrink, but it was not applied to the images inside the html code.

All I want is to have a rotating banner, inside my flex container/grid.

Is there a way to make it possible?

PS - by rotating i mean display one banner at a time, randomly.

Thanks!
User avatar
Pablo
 
Posts: 21577
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo »

Why not use the built-in Slide show? it also supports 'random' mode.
longman
 
 
Posts: 100
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman »

I tried but the image gets big inside the flexgrid.

Moreover, I want one image randomly to be displayed by each time the page is opened/refreshed.
User avatar
Pablo
 
Posts: 21577
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo »

I do not think the slideshow can be inside a flex grid. A slideshow is a JavaScript controlled element, so it will override the flexgrid properties.
However, it should work with layout grids or full width on the page itself.
Moreover, I want one image randomly to be displayed by each time the page is opened/refreshed.
Please see the help.
longman
 
 
Posts: 100
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman »

Hi Pablo,

Do you mean this Help page? http://www.wysiwygwebbuilder.com/slideshow.html

I see no mention or option for the photos to be displayed randomly (each time the page is visited). I see it has only the option of animation, after seconds the other images will be shown, which is not my aim.

Moreover, I used Layout grid, it worked but the image did not shrink. I went to image flexbox, add value 1 to Flex shrink, i previewed and it did not shrink.
User avatar
Pablo
 
Posts: 21577
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo »

I see no mention or option for the photos to be displayed randomly (each time the page is visited).
No, I meant the help (F1)
Random
The images will be displayed in random order. If you set the 'Pause time' to 0 (zero) then the SlideShow can be used to display a random image each time you visit the website.
Moreover, I used Layout grid, it worked but the image did not shrink. I went to image flexbox, add value 1 to Flex shrink, i previewed and it did not shrink.
Please set full width to 'true'
longman
 
 
Posts: 100
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman »

Thanks! worked nicely! Wish it was possible to add Slide Show to Flexgrids too, I have sidebar banners in flexboxes (can't use layout grid for sides) then i could make sidebar banners rotating too.
longman
 
 
Posts: 100
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman »

once it worked, images was shown randomly by each refresh, now it does not work.

I can't figure out what's wrong?

I have attached example file here https://expirebox.com/download/256ab1cd ... 450e7.html

appreciate your help!
User avatar
Pablo
 
Posts: 21577
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo »

The image file name is invalid.
https://www.wysiwygwebbuilder.com/forum ... f=10&t=131

Also, I think you will need to add more images.
longman
 
 
Posts: 100
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman »

it was the number of images. it does not work with two photos, but more than two photos.

Is there a reason for it? or a bug? I wanted to have two banners rotating...
User avatar
Pablo
 
Posts: 21577
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo »

I think this is a limitation of the random algorithm of JavaScript.
Post Reply