WordPress.org

1. benthv
   Member
   Posted 1 year ago #
   

   I want to put a background image in a div using the jquery .css function but for some reason it doesn't work. The funny thing is, setting the background to a color works, and I have done this in other sites that aren't wordpress sites before. Is this a wordpress issue? I mean the code is pretty simple:

   <div id = "somediv">
   </div>
   <!-- and a couple lines beneath it I have -->
   <script>
      $('#somediv').css('background','url("images/image.jpg")');
   </script>

   naturally the div has a width and height and everything in the css file. Anyway if I were to replace 'url("images/image.jpg")' with 'black' or some other color it works. Does anybody have any idea with what could be going on here?

2. randomfrequency
   Member
   Posted 1 year ago #
   

   hi benthv,

   the CSS issue may be twofold...

   1) "#somediv" is being overidden in a previous CSS style or a style labeled !important

   2) the div you are using is being applied too many styles to that div, separate a "separate" new div just for this background img

   3) you didn't load the Jquery library for some reason...

   4) you didn't express $(init); at beginning of the script

   try these tips and see if it works...

   gl
   randomfrequency out...

3. benthv
   Member
   Posted 1 year ago #
   

   Thanks for the reply! I'm pretty new to doing this stuff. I haven't seen $(init) before, but any initialization stuff shouldn't be a problem because the script is after the div, right? Well anyway it's not being overridden by anything, I tried a seperate div but it had the same issue, jQuery is loaded, and what is weird is that solid colors work but .jpg images don't. Is there anything else that could possibly be causing this problem? There are no other java script libraries or plug-ins or scripts either in the page yet so far.

Topic Closed

This topic has been closed to new replies.