Hi All,
My first post.
Scenario: Learning how to make use of third part javascript libraries.
Library: qtip (http://qtip2.com/). Display enhance tooltip to web elements.
The instructions from their website is to do something as below on document ready of page.
I understand the $ and jQuery conflict needing to be sorted and as per one of the videos, inspecting the page source I can see this is taken care of
My query hence is how to identify the id's associated to an element. In AA design I have defined a button to have name BUTTON01, when I inspect the element in browser, the name is given as DLG1.V.R1.BUTTON01, I have tried these two alternates in code in onRenderComplete of the component but not having much joy.
Please advice on syntax I should be using to achieve this.
Incidentally, the qtip library once loaded has many classes defined which become available to the elements, now with the same code, but using class definitions, I am able to get the qtip showing as this snippet shows
hence just need to confirm the id part which would be more easier to manage.
Regards,
KotinKarwak
My first post.
Scenario: Learning how to make use of third part javascript libraries.
Library: qtip (http://qtip2.com/). Display enhance tooltip to web elements.
The instructions from their website is to do something as below on document ready of page.
Code:
$('#tryMe').qtip({ content: 'TRY ME!. I use the built-in jQuery .slideUp() and .slideDown() methods', show: { effect: function() { $(this).slideDown(); } }, hide: { effect: function() { $(this).slideUp(); } } });
Code:
<script> if(typeof jQuery != 'undefined') jQuery.noConflict(); </script>
Code:
//This fails, tried also BUTTON01 as the name jQuery([B][COLOR="#FF0000"]'#DLG1.V.R1.BUTTON01'[/COLOR][/B]).qtip({ content: 'XXX: I use the built-in jQuery .slideUp() and .slideDown() methods', show: { effect: function() { $(this).slideDown(); } }, hide: { effect: function() { $(this).slideUp(); } } });
Incidentally, the qtip library once loaded has many classes defined which become available to the elements, now with the same code, but using class definitions, I am able to get the qtip showing as this snippet shows
Code:
jQuery('.qtip-red').qtip({ content: 'I use the built-in jQuery .slideUp() and .slideDown() methods', show: { effect: function() { $(this).slideDown(); } }, hide: { effect: function() { $(this).slideUp(); } } });
Regards,
KotinKarwak
Comment