Monday, December 28, 2009

[jQuery] How to call a jquery/javascript var in a WP template

Here is the web page I am working on

http://bivenshouse.com/?page_id=16

I have setup a jquery that I think (I hope) works to define divHeight.

Code:
<script src="http://bivenshouse.com/wp-content/themes/glossyblue/js/
jquery-1.3.2.min.js
" type="text/javascript">

<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function(){

//dimension
var divHeight = (jQuery('#page').height())+20;
jQuery("#sidebar").height(divHeight);
//alert(divHeight);
});

// mouseover script for images on products page
function flipImage(url,names){
if(document.images)document[names].src=url;
}
</script>

But I don't know how to call a variable in my template.

Here is my sidebar.php

Code:
<div id="sidebar" style="height: 700px;">
<ul>
<li><h3 class="sidebartitle">&nbsp;</h3></li>
<li class="cat-item"><a href="http://bivenshouse.com/?page_id=11"
title="Bivens House News">News</a></li>
<li class="cat-item"><a href="http://bivenshouse.com/?page_id=13"
title="Bivens House Press Releases">Press Releases</a></li>
</ul>
</div><!-- /sidebar -->

Currently the style height is hardcoded but I want to be able to use
the divHeight from jQuery but I can't figure out how to call it from
inside WP.

Any suggestions are greatly appreciated.

- Steve

No comments: