Forums

Concrete 5 Toolbar Disappears - Conflict with Javascript - Need Help

Permalink
Hi
my homepage admin toolbar disappeared due to a conflict with the qtip tool tip (javascript) I am using. is there anyway around that without dumping the qtip plugin I am using? its the only tooltip that works with an imagemap, so I sorta need it.

I should also add that it conflicts with the slider add on I have installed...

anyone know a way around the conflict?

thanks
 
JohntheFish replied on at Permalink Reply
JohntheFish
Is it qtip that is causing the issue? Or are you maybe double-loading jQuery when you load qtip?

You may also want to check the actual jQuery namespace of the qtip plugin and confirm it doesn't conflict with anything in Bootstrap. Bootstrap began by using qtip, but now has its own code.
bmackler replied on at Permalink Reply
hmmm

this is the code that I have in the header...Is there something I should take out?

When I have the loader:element at the top, the qtip works but concrete5 doesnt...., when I move it to the bottom, the opposite happens.

this is what I used -http://craigsworks.com/projects/qtip/demos/position/imagemap

<?php Loader::element('header_required'); ?>
<style type="text/css">
body {
   background-image: url(<?=$this->getThemePath()?>/images/bkg.jpg);
   margin-top: 0px;
   margin-bottom: 0px;
   margin-left: 0px;
   margin-right: 0px;
}
</style>
  <link href="<?=$this->getThemePath()?>/css.css" rel="stylesheet" type="text/css" />
<link type="text/css" rel="stylesheet" href="http://www.fencingfoundationofamerica.org/tooltip/master.css"  />
<link type="text/css" rel="stylesheet" href="http://www.fencingfoundationofamerica.org/tooltip/qtip.css"  />
<link type="text/css" rel="stylesheet" href="http://www.fencingfoundationofamerica.org/tooltip/demo.css"  />
<link type="text/css" rel="stylesheet" href="http://www.fencingfoundationofamerica.org/tooltip/highlight.css"  />
Viewing 15 lines of 42 lines. View entire code block.
JohntheFish replied on at Permalink Best Answer Reply
JohntheFish
You definitely don't need to load the qtip version of jquery.js
<script type="text/javascript" src="http://www.fencingfoundationofamerica.org/tooltip/jquery-1.3.2.js"></script>


jquery is usually already loaded from c5's own copy, but may not be if no-one is logged in. So you may want to add a line to get the standard c5 copy of jquery. That way you will guarantee it is loaded no matter what.

A completely separate observation: Is demo part of your theme? or just dregs carried over from an example you are following? Same goes for all the other files except for qtip itself.
bmackler replied on at Permalink Reply
awesome. that did it. I took out the jquery and both work.

you mentioned "adding a line to get the standard copy of jquery for c5"

what would the code for that be? how do I access that?
JohntheFish replied on at Permalink Reply
JohntheFish
Off the top of my head I don't know the exact path without looking. First place to look would be in the default theme header elements.

Off the top of my head, something like
$html = Loader::helper('html');
$this->addHeaderItem($html->javascript('jquery.js'));

close before 
Loader::element('header_required');


When doing this sort of thing, its often useful to have a different browser on the same page but not logged in.
bmackler replied on at Permalink Reply
Interesting
but I took out the only coded reference to the jquery file, C5 loads it automatically I guess? or should I use the code you posted to be sure?

Thanks again for the help
JohntheFish replied on at Permalink Reply
JohntheFish
It all depends on the theme, other blocks on the page, and if anyone is logged in.

So check with a different browser and not logged in and nothing but non-javascripted blocks on the page.
bmackler replied on at Permalink Reply
I used my own theme, my own files for the website, so jquery would not have been installed otherwise....perhaps it was pulled in by other blocks

I checked a few browsers and it still worked

thanks for your help!