Title: Javascript not functioning properly on wordpress
Last modified: August 21, 2016

---

# Javascript not functioning properly on wordpress

 *  Resolved [kmurrayfrgraphics](https://wordpress.org/support/users/kmurrayfrgraphics/)
 * (@kmurrayfrgraphics)
 * [12 years, 6 months ago](https://wordpress.org/support/topic/javascript-not-functioning-properly-on-wordpress/)
 * A few weeks ago I added this javascript to my website and had it properly working
   on my website, but now it seems to not be functioning.
 * [http://working.frgraphicsolutions.com/services/](http://working.frgraphicsolutions.com/services/)
 * The script is called:
 * tooltips.js
 * ***It is a javascript that will make the `<abbr>` tag to become responsive so
   when a person is viewing the site on a mobile device they can click instead of
   hover over the object and it will allow them to see the information.***
 * Unfortunately even though the page is calling the javascript it is not preforming
   it’s function. So the viewer will not be able to see the information at all when
   on a phone or tablet.
 * The code reads like this:
 *     ```
       jQuery( document ).ready( function($)
           {
           var targets = $( '[rel~=tooltip]' ),
               target  = false,
               tooltip = false,
               title   = false;
   
           targets.bind( 'mouseenter', function()
           {
               target  = $( this );
               tip     = target.attr( 'title' );
               tooltip = $( '<div id="tooltip"></div>' );
   
               if( !tip || tip == '' )
                   return false;
   
               target.removeAttr( 'title' );
               tooltip.css( 'opacity', 0 )
                      .html( tip )
                      .appendTo( 'body' );
   
               var init_tooltip = function()
               {
                   if( $( window ).width() < tooltip.outerWidth() * 1.5 )
                       tooltip.css( 'max-width', $( window ).width() / 2 );
                   else
                       tooltip.css( 'max-width', 340 );
   
                   var pos_left = target.offset().left + ( target.outerWidth() / 2 ) - ( tooltip.outerWidth() / 2 ),
                       pos_top  = target.offset().top - tooltip.outerHeight() - 20;
   
                   if( pos_left < 0 )
                   {
                       pos_left = target.offset().left + target.outerWidth() / 2 - 20;
                       tooltip.addClass( 'left' );
                   }
                   else
                       tooltip.removeClass( 'left' );
   
                   if( pos_left + tooltip.outerWidth() > $( window ).width() )
                   {
                       pos_left = target.offset().left - tooltip.outerWidth() + target.outerWidth() / 2 + 20;
                       tooltip.addClass( 'right' );
                   }
                   else
                       tooltip.removeClass( 'right' );
   
                   if( pos_top < 0 )
                   {
                       var pos_top  = target.offset().top + target.outerHeight();
                       tooltip.addClass( 'top' );
                   }
                   else
                       tooltip.removeClass( 'top' );
   
                   tooltip.css( { left: pos_left, top: pos_top } )
                          .animate( { top: '+=10', opacity: 1 }, 50 );
               };
   
               init_tooltip();
               $( window ).resize( init_tooltip );
   
               var remove_tooltip = function()
               {
                   tooltip.animate( { top: '-=10', opacity: 0 }, 50, function()
                   {
                       $( this ).remove();
                   });
   
                   target.attr( 'title', tip );
               };
   
               target.bind( 'mouseleave', remove_tooltip );
               tooltip.bind( 'click', remove_tooltip );
           });
           });
       ```
   
 * I created a function.php for the child theme that has the code only called to
   on this specific page:
 *     ```
       <?php
           if ( !function_exists( 'tool_tips' ) ) {
           function tooltips() {
           if ( is_page( 'services' ) ) {
           wp_enqueue_script( 'tooltips', get_stylesheet_directory_uri() . '/js/tooltips.js', '', '1.0', true );
           }
           }
           }
           add_action( 'wp_enqueue_scripts', 'tooltips' );
   
           ?>
       ```
   
 * Like I stated earlier, it has been functioning the past few weeks with no issues(
   I even checked it over this past weekend) and today I noticed it stopped working.
 * Since the page is actually calling the script, but it is not functioning I believe
   there is something wrong with my script or another script is effecting it. I 
   am new to jQuery, so it is harder for me to find issues through the code when
   I know many here can see pretty easily.
 * Thank you very much.
 * _[Moderator Note: Please ensure that you are embedding links correctly in your
   posts.]_

Viewing 2 replies - 1 through 2 (of 2 total)

 *  [Steven Jones](https://wordpress.org/support/users/stompweb/)
 * (@stompweb)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/javascript-not-functioning-properly-on-wordpress/#post-4340133)
 * Can you confirm the following:
    - It is being loaded on the page
    - It is being loaded after jQuery
    - There are no errors in the console
 *  Thread Starter [kmurrayfrgraphics](https://wordpress.org/support/users/kmurrayfrgraphics/)
 * (@kmurrayfrgraphics)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/javascript-not-functioning-properly-on-wordpress/#post-4340139)
 * So my site is hosted through godaddy and I took the liberty of reverting back
   to an older version of wordpress then re-updating it to the current version.
 * Godaddy or WordPress managed to pull from an old database and delete created 
   pages (still keeping my file manager intact though) and now the jQuery has no
   problem loading.
 * I am completely unsure what the issue was since the script was being loaded. 
   I am unsure if it was being unloaded after jQuery, but no errors were showing
   when I ran Inspector on FireFox.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Javascript not functioning properly on wordpress’ is closed to new replies.

## Tags

 * [javascript](https://wordpress.org/support/topic-tag/javascript/)
 * [jquery](https://wordpress.org/support/topic-tag/jquery/)

 * In: [Hacks](https://wordpress.org/support/forum/plugins-and-hacks/hacks/)
 * 2 replies
 * 2 participants
 * Last reply from: [kmurrayfrgraphics](https://wordpress.org/support/users/kmurrayfrgraphics/)
 * Last activity: [12 years, 5 months ago](https://wordpress.org/support/topic/javascript-not-functioning-properly-on-wordpress/#post-4340139)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics