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: 148
Joined: Sat May 19, 2018 1:23 pm

responsive rotating banner - how?

Post by longman » Sun Jul 08, 2018 12:19 pm

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: 13084
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo » Sun Jul 08, 2018 12:38 pm

Why not use the built-in Slide show? it also supports 'random' mode.

longman
 
 
Posts: 148
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman » Sun Jul 08, 2018 1:52 pm

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: 13084
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo » Sun Jul 08, 2018 3:27 pm

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: 148
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman » Mon Jul 09, 2018 4:41 am

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: 13084
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo » Mon Jul 09, 2018 5:45 am

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: 148
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman » Mon Jul 09, 2018 7:06 am

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: 148
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman » Mon Jul 09, 2018 8:10 am

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: 13084
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo » Mon Jul 09, 2018 8:57 am

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: 148
Joined: Sat May 19, 2018 1:23 pm

Re: responsive rotating banner - how?

Post by longman » Mon Jul 09, 2018 9:11 am

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: 13084
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: responsive rotating banner - how?

Post by Pablo » Mon Jul 09, 2018 11:58 am

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

Post Reply

Who is online

Users browsing this forum: No registered users and 3 guests