简体   繁体   中英

Javascript Rollover in Wordpress

I would like to ask about the Button with Roll Over Javascript I have in my wordpress theme, the problem is the code is divided in two parts:

The 1st code is about Javascript

<script>
<!--
if(document.images)
{
  var image_array = new Array();

  // path to the directory with images
  var path = '/img/';

  // enumeration of the "active" images
  image_array[0] = "<?php bloginfo('template_directory'); ?>/button1_red.png";
  image_array[1] = "<?php bloginfo('template_directory'); ?>/button2_red.png";
  image_array[2] = "<?php bloginfo('template_directory'); ?>/button3_red.png";

  var preload_image = new Array ();

 for(var i=0; i<image_array.length; i++)
  {
    preload_image[i]= new Image();
    preload_image[i].src = image_array[i];
  }
}

function rollover(name, filename)
{
    var fullpath = '' + filename;
    document.images[name].src = fullpath;
}
//-->
</script>

<!--ROLL OVER SCRIPT-->

and the 2nd is html.

        <div id="buttons">

            <a href="http://www.facebook.com/pages/Ben-Daggers/209582909053404" target="_blank" onmouseover=rollover('button1','<?php bloginfo('template_directory'); ?>/button1_red.png'); onmouseout=rollover('button1','<?php bloginfo('template_directory'); ?>/button1_blue.png')><img src="<?php bloginfo('template_directory'); ?>/button1_blue.png" name="button1" width="35" height="35" border="0" title="Like us on Facebook!" alt="BenDaggers.com: Like us on Facebook!"></a>
            <a href="http://twitter.com/bendaggers" target="_blank" onmouseover=rollover('button2','<?php bloginfo('template_directory'); ?>/button2_red.png'); onmouseout=rollover('button2','<?php bloginfo('template_directory'); ?>/button2_blue.PNG')><img src="<?php bloginfo('template_directory'); ?>/button2_blue.PNG" name="button2" width="35" height="35" border="0" title="Follow us on Twitter!" alt="BenDaggers.com: Follow us on Twitter!"/></a>
            <a href="http://feeds.feedburner.com/bendaggers" target="_blank" onmouseover=rollover('button3','<?php bloginfo('template_directory'); ?>/button3_red.png'); onmouseout=rollover('button3','<?php bloginfo('template_directory'); ?>/button3_blue.PNG')><img src="<?php bloginfo('template_directory'); ?>/button3_blue.PNG" name="button3" width="35" height="35" border="0" title="Subscribe to our RSS Feeds!" alt="BenDaggers.com: Subscribe to our RSS Feeds!" /></a>

</div>

Where should i put the javascript code since the Button should be in sidebar (sidebar.php)?

I tried putting the javascript in the index.php and the html code in sidebar.php but its not working.

Any help?

将HTML放在sidebar.php并将javascript放在header.php (假设主题有header.php文件)在<head>标记内。

Because your html part depends on the Javascript part, the Javascript part must go first in the page. The simplest way to ensure this without knowing much about the structure of Wordpress is simply include both snippets in the same place, say sidebar.php , one after the other.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM