CODEWITHSUNDEEP
jqueryhtmlzurb-foundation
user2721035
user2721035

Reputation: 13

How can i make Foundation tooltip show on focus?

this is what i am doing.

<input  data-tooltip  data-width="350" class="has-tip tip-left" title="enter name" type="text" />
<script>
$(document).foundation();

tooltip is working fine on hover to input but i want to call it on focus. please help?

Upvotes: 1

Views: 2747

Answers (3)

Ron Marcelle
Ron Marcelle

Reputation: 11

Foundation.libs.tooltip.showTip( jQuery( ".has-tip" ) );

You might want to add an #id to the span to make a more specific selector for the showTip function.

See: https://github.com/zurb/foundation/blob/master/js/foundation/foundation.tooltip.js

Upvotes: 1

Prabhakaran Parthipan
Prabhakaran Parthipan

Reputation: 4273

Demo

Try this..

$('input').focus(function() {
     $('div').show();
}).focusout(function() {
    $('div').hide();
});

Upvotes: -1

RONE
RONE

Reputation: 5485

$(".has-tip").focus(function(){
  $(this).foundation();
});

But make sure, you may want to hide the tooltip on focus out. for that you may do this 

$(".has-tip").blur(function(){

//may be you can hide the tooltip or call the hide function if any.
});

Note, calling events may change according to the jquery version.

Upvotes: 1

Related Questions