Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript $(this).closest is not a function? Re: $(this).closest is not a function?

#76338
Ian G
Participant

Alright so an update and a reworking of the problem.

I was able to get the basics of Drupal jquery functioning with this plugin and I learned a bit about the two big issues I was having with the Bubble Up script.

1. The jquery bubbleup uses jquery 1.4.x, which is not supported by Drupal yet (only up to 1.3.x).

2. Drupal has a known issue regarding resolving paths, which makes a problem for theming with hardcoded html paths in content areas.

On the first issue, it seems so far that just linking to the Google hosted file works. My uderstanding is that others have tried to get Jquery 1.4 to work with Drupal, but it is still buggy and causes problems, mainly with the output filter system Views. As of yet I haven’t noticed any issues, so fingers crossed.

The second issue is more of a problem. Using a href img src="some path" in the body of a content block doesn’t work with clean url’s for a reason that is outside of my ability to understand at this point. Suffice it to say that you apparently need to force Drupal to use a set base path for the file system, and though there seems to be a way to use php and base_path . drupal_get_path commands, I couldn’t get it to work. Mixing php and html in a block wouldn’t fly for some reason.

So I am back to trying to resolve the issue using CSS. The problem I am having now is that my planned approach to add classes to each li element and then assign images the images I need to them seems to break the javascript function or not apply the images as expected.

I tried changing this

Code:
  • Full RSS Feed
  • to this

    Code:
  • Full RSS Feed
  • and then use CSS to add a background image to bypass Drupal’s inability to find the image path. Actually what it is doing is not using the theme folder as the base path for nodes for some reason, but that’s probably TMI…

    Code:
    .feedimg{
    background: url(images/feed/feed.png) no-repeat;
    width: 10px;
    }

    But the image wouldn’t appear and/or broken the javascript function. Given the bubbleup.js function above, is there a way to formulate the li class or the javascript function to accept new classes for background images? Or am I going about this the wrong way from the Javascript/CSS perspective?