Please Log-in or Register to get full access to the forums.


Post Reply 
 
Thread Rating:
  • 0 Votes - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Mulitple qTips on qTip from remote page via ajax
12th January, 02:47
Post: #1
Mulitple qTips on qTip from remote page via ajax
Hi, I've been trying to figure this out for a while with no luck. I have got the primary tip working well. It pulls from another web page and just a specific element of that page, a div.

I wish to have additional qTips with just static content (meaning same now matter which page is pulled) on that poup.

I cannot figure out how to get the second qTips working. You can see an example of how I wish it to work on this site from where I was led to qTip in the first place. However, I cannot see how they implement it.

http://www.alabu.com/almond-moisturizing...milk-soap/

Hover over their ingredient list and see the additional qTips on that popup.

Here is the js I'm using to get the primary popup. The additional qTips would be on elements within the div pulled from the external page.
JS Code
$(document).ready(function(){
     $('.infopane').each(function() {
         $(this).qtip({
            content: {
                text: function(event, api) {
                    $.ajax({
                        url: $(this).attr('page')
                    })
                    .then(function(content) {
                        var elements = $("<div />").append( $.parseHTML(content) ).find('#otip');
						// Set the content of the tooltip to the selected element(s)
						api.set('content.text', elements);
                    }, function(xhr, status, error) {
                        api.set('content.text', status + ': ' + error);
                    });
                    return 'Loading...';
                }
            },
            position: {
              	target: 'event', // Use the triggering element as the positioning target
				my: 'bottom center',
				at: 'right center',
				adjust: { y: -15 },
                viewport: $(window)
            },
           style: { 
             classes: 'qtip-light qtip-rounded qtip-shadow'
           },
           hide: {
             fixed: true,
        	 delay: 1500
    		}
         });
     });
 
 });
Find all posts by this user
Quote this message in a reply
Post Reply 


Possibly Related Threads...
Thread: Author Replies: Views: Last Post
  qTip 2 and Ajax 2nd Request for update shantaram 0 83 13th February 13:18
Last Post: shantaram
  Ajax request only for updated qtip content, otherwise cache request sadat 0 100 2nd February 10:29
Last Post: sadat
  How to display an html page in qtip billyjoe 0 439 22nd June 21:48
Last Post: billyjoe
  Problem referencing an external html page with Ajax andreaangeli 0 540 21st February 17:44
Last Post: andreaangeli
  Firefox only. When scrolled down the page qTip takes wrong position sree 1 545 15th February 10:29
Last Post: sree
  qTip no removing after ajax page loag with a tag darkav 0 507 20th January 23:54
Last Post: darkav
  Position of Tooltip off screen when lower on the page madebyspark 1 1,019 27th July 02:06
Last Post: madebyspark
  qTip2 and ajax-request on same page (problems)! Ionit 1 761 29th June 16:23
Last Post: Ionit
  script error on page samiloti 0 794 10th June 11:01
Last Post: samiloti
  qTips always appear above static elements? shoor 0 648 16th May 03:13
Last Post: shoor



User(s) browsing this thread: 1 Guest(s)