Response title
This is preview!
Need help with Random BG Image combined with auto scaled bg image plugins.
in Using jQuery Plugins
•
11 years ago
Hello everyone,
I've been searching for a resolution to this issue for hours trying to customize my page located at http://gqmissionstest.publishpath.com
Specifically, I'm trying to figure out why this line of code is not making my images display in the background: Original plugin script provided here: http://briancray.com/2009/12/28/simple-image-randomizer-jquery/
I've been searching for a resolution to this issue for hours trying to customize my page located at http://gqmissionstest.publishpath.com
Specifically, I'm trying to figure out why this line of code is not making my images display in the background: Original plugin script provided here: http://briancray.com/2009/12/28/simple-image-randomizer-jquery/
- <script>
var images = ['bg00.jpg', 'bg01.jpg', 'bg02.jpg', 'bg03.jpg', 'bg04.jpg'];
$('#homePage').css({'background-image': 'url(images/' + images[Math.floor(Math.random() * images.length)] + ')'});
$('<img src="images/' + images[Math.floor(Math.random() * images.length)] + '">').appendTo('#body');
</script>
I made adjustments with my image references that are all located in this directory: http://gqmissionstest.publishpath.com/websites/gqmissionstest/templates/gq/images/
Problem: No images load, and I believe I don't fully understand the .appendTo tage.. I don't know if #body is correct. The author of the plugin assumed I understood the relation. Also #homePage may be incorrect as well.
Additionally, I found another plugin that worked for placing an image in the background (not random), and the background image would scale to size, according the users window. I loved that and it worked, just wanted to add random images to the same script.... first things first... I can't even get an image to display at all with the above code.
In case you wanted to know the script I was using to scale the background image, here it is below (although, as you will see in the code for my site - this image feature is disabled as I am trying to make adjustments).
code for image solutions used:
HTML
If I can get this second code to work with the random image plugin, I will be a super happy camper!
Been at this for hours - out of time - hence why I'm here. Any help would be uber great.
Thanks,
Nickolas
Problem: No images load, and I believe I don't fully understand the .appendTo tage.. I don't know if #body is correct. The author of the plugin assumed I understood the relation. Also #homePage may be incorrect as well.
Additionally, I found another plugin that worked for placing an image in the background (not random), and the background image would scale to size, according the users window. I loved that and it worked, just wanted to add random images to the same script.... first things first... I can't even get an image to display at all with the above code.
In case you wanted to know the script I was using to scale the background image, here it is below (although, as you will see in the code for my site - this image feature is disabled as I am trying to make adjustments).
code for image solutions used:
HTML
- <img alt="full screen background image" src="images/bg00.jpg" id="full-screen-background-image" />
CSS
- #full-screen-background-image {
z-index: -999;
min-height: 100%;
min-width: 1024px;
width: 100%;
height: auto;
position: fixed;
top: 0;
left: 0;
}
If I can get this second code to work with the random image plugin, I will be a super happy camper!
Been at this for hours - out of time - hence why I'm here. Any help would be uber great.
Thanks,
Nickolas
1
