Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery Background Image change, help needed please
    primarykey
    data
    text
    <p>Ok, I've been trying to wrap my head around this for about an hour and a half, done multiple searches, and nothing to my avail. I have to go about it this way, so I cannot change how the structure of this.</p> <p>In the admin panel, I have a div set (#background-preview)</p> <p>When the select option(s) change (#pbi) then it will change the background image of (#background-preview). </p> <p>I'm not used to vars in jQuery, and this is my most major problem at the moment.</p> <p>I would make a fiddle, but it doesn't really help too much since I have a lot of functions.</p> <p>Here is my jQuery code:</p> <pre><code>$( "#pbi" ).on('change', function() { var templateDir = '&lt;?php bloginfo("template_directory"); ?&gt;'; $('#background-preview').css('background-image','url(templateDir + "/images/logo.png")'); }); </code></pre> <p>If I remove the tempateDir from the .css area, then it works. It just won't work with the templateDir, and this is really bugging me! I just can't wrap my head around it.</p> <p>and then on top of that.. it will look like this in the end</p> <p>templateDir + '/images/backgrounds/' $(this).val() &lt;-- val of #pbi. I just haven't made it this far, so any help with that would be nice, or I will just attempt that hurtle next ;)</p> <p>----EDIT----</p> <p>This is my PHP/HTML</p> <pre><code>&lt;div id="background-preview" style="background-image: url('&lt;?php echo get_template_directory_uri(); ?&gt;/images/backgrounds/&lt;?php echo get_option('peridot_background_image'); ?&gt;');"&gt; &lt;select name="peridot_background_image" id="pbi"&gt; &lt;?php peridot_background_images(); ?&gt; &lt;/select&gt; &lt;/div&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload