I am using the jquery qtip2 to create a mouseover qtip..here is the code:
$(document).ready(function() {
  $("#optionalProdsImgPreview_1").qtip({
      content: "<img src='http://mysite.com/myimg.jpg' width='100' height='150' />",
        show: {
          solo: true
        },
        hide: {
          delay: 400,
          fixed: true,
          event: "mouseout"
        },
        style: {
          tip: {
            corner: "rightMiddle"
          },
          classes: "ui-widget-content"
        },
        position: {
          adjust: 开发者_运维技巧{
            x: -18,
            y: 0
          },
          at: "left center",
          my: "right center"
        }
    });
  });
This basically opens an preview image when the mouse is over a the link such as this:
<a href="#" id="optionalProdsImgPreview_1">My great product here</a>
Now what I want to do is open a different qtip when someone clicks on that link. Also the mouseover qtip should close as well. Do I just do that via jquery .click or should I do this via some other method or maybe qtip has some way of accomplishing this?
Thanks
Nevermind. I figured out the solution myself.
http://craigsworks.com/projects/qtip2/tutorials/advanced/#multi
Here is my full code:
$(document).ready(function() {
  $("#optionalProdsImgPreview_1").qtip({
      content: "<img src='http://mysite.com/myimg.jpg' width='100' height='150' />",
        show: {
          solo: true
        },
        hide: {
          delay: 400,
          fixed: true,
          event: "mouseout"
        },
        style: {
          tip: {
            corner: "rightMiddle"
          },
          classes: "ui-widget-content"
        },
        position: {
          adjust: {
            x: -18,
            y: 0
          },
          at: "left center",
          my: "right center"
        }
    })
    .removeData('qtip')
    .qtip( $.extend({}, shared, {
       content: "My New Content is HERE!"
    }));
  });
The solution may now have changed with the latest version of qTip2. In order to get multiple qTips to work on the same target I had to add the overwrite:false option to the second qtip.
http://qtip2.com/options#core.overwrite
 
         
                                         
                                         
                                         
                                        ![Interactive visualization of a graph in python [closed]](https://www.devze.com/res/2023/04-10/09/92d32fe8c0d22fb96bd6f6e8b7d1f457.gif) 
                                         
                                         
                                         
                                         加载中,请稍侯......
 加载中,请稍侯......
      
精彩评论