Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Twitter bootstrap popover without title and close popover when outside
# This plugin does two things:
# 1. make popover with no title, https://github.com/twitter/bootstrap/issues/1892
# 2. click elsewhere to close, http://jsfiddle.net/asanger/AFffL/266/
( ($) ->
$.fn.content_popover = (options) ->
$.each @, () ->
# Default set to false
isVisible = false
clickedAway = false
options = $.extend(
html: true
trigger: 'manual'
template: '<div class="popover"><div class="arrow"></div><div class="popover-inner"><div class="popover-content"><p></p></div></div></div>'
, options)
$(@).popover(options)
# tigger this event when you want to show popover immediately
$(@).bind 'showPopover', () ->
isVisible = true
clickedAway = true
return
# When click on the link, show the popover
$(@).click (event) =>
event.preventDefault()
$(@).popover('show')
clickedAway = false
isVisible = true
$('.popover').bind 'click', () ->
clickedAway = false
isVisible = true
return
return
# When click on document, show or hide
$(document).click (event) =>
if isVisible && clickedAway
$(@).popover('hide')
isVisible = false
clickedAway = false
else
clickedAway = true
return
return
# when click on bootstrap-dropdown, close popover
$('.dropdown-toggle').click (event) ->
$('body').click()
return
return
return
) jQuery
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment