I use a 70 / 30 layout and would like to add a module on the 30 side that rotates random images. I read about using php to accomplish this, but is there an easier way for non-technical users?
Announcement
Collapse
No announcement yet.
Rotating Banner
Collapse
X
-
You can use pure Javascript to do it. You just have to hardcode in the script the URLs of all the possible images you want to display.
See below sample script I just did for you. You can use a Static HTML module for this.
HTML Code:<img id="rotateImage" src="https://vbmods.rocks/filedata/fetch?id=6967&d=1508057154" /> <script> (function() { var bannerImages = [ "https://vbmods.rocks/filedata/fetch?id=6967&d=1508057154", "https://vbmods.rocks/filedata/fetch?id=6964&d=1508045443", "https://vbmods.rocks/filedata/fetch?id=6968&d=1508057279" /* no trailing comma at the last element */ ], image = document.getElementById('rotateImage'); function rotateImage() { var index = Math.floor(Math.random() * bannerImages.length); image.src = bannerImages[index]; } window.setInterval(rotateImage, 1000); //1000 (msec) = 1 sec (adjust as needed) })(); </script>
Helpful? Donate. Thanks!
Fast VPS Host for vBulletin:
A2 Hosting & IONOS
- Top
- Translate
- Bottom
-
What I showed you was a just a simple rotating banner script that I quickly created as a kind of prototype. If you want a full-featured script, then you'd have to find one or use the one that the Content Slider module uses which is https://www.jssor.com. But it will not be easy for non-technical users to implement.Helpful? Donate. Thanks!
Fast VPS Host for vBulletin:
A2 Hosting & IONOS
- Top
- Translate
- Bottom
Comment
-
I can't seem to get it to work with linked images. Why doesn't it work by pre-populating the link in bannerImages?
<img id="rotateImage" src="http://mysite.com' target="_blank"><img src='https://mysite.com/fa2559af99820075c7b8" />
<script>
(function() {
var bannerImages = [
"<a href = "http://mysite.com' target="_blank"><img src="https://mysite.com/fa2559af99820075c7b8"></a>",
"<a href = "http://mysite.com/help" target="_blank"><img src="https://mysite.com/46c7969d548125d7e658"></a>",
],
image = document.getElementById('rotateImage');
function rotateImage() {
var index = Math.floor(Math.random() * bannerImages.length);
image.src = bannerImages[index]; }
window.setInterval(rotateImage, 1000);
})();
</script>
- Top
- Translate
- Bottom
Comment
-
I created a simple rotating banner script at https://vbmods.rocks/forum/vbulletin...-banner-scriptHelpful? Donate. Thanks!
Fast VPS Host for vBulletin:
A2 Hosting & IONOS
- Top
- Translate
- Bottom
Comment
Users Viewing This Page
Collapse
There is 1 user viewing this forum topic.
- Guest
Latest Posts
Collapse
-
Get Affordable and Fast VPS for vBulletin -
by mbrmbrAs the title states, would you consider creating a mod that removes single post links from the home page? This would be for SEO purposes, search engines...Yesterday, 01:20 PM
Comment