Home › Forums › JavaScript › Bootstrap Static Popovers
- This topic is empty.
-
AuthorPosts
-
January 12, 2013 at 8:32 pm #120816
DesignLady94
Memberon this page. See the static popover examples at http://twitter.github.com/bootstrap/javascript.html#popovers.
January 12, 2013 at 8:32 pm #120817DesignLady94
MemberI want to replace the paragraphs on the refer.php page with popovers containing the contact. Then I would list the cite reference below.
January 12, 2013 at 8:33 pm #120818DesignLady94
MemberActually no, I would include the reference as the popover title.
January 12, 2013 at 8:33 pm #120819TheDoc
MemberI mean on this page: http://www.debbierking.com/bootstrap/refer.php
Where do you have the attempted popovers?
January 12, 2013 at 8:34 pm #120820TheDoc
MemberHmmmmm. Basically I’m trying to figure out where you’re attempted code is.
January 12, 2013 at 8:35 pm #120821DesignLady94
MemberRight under the Testimonials title.
January 12, 2013 at 8:38 pm #120822TheDoc
MemberAll I see are paragraphs and links.
Have you:
a) included the necessary Bootstrap JS/CSS
b) updated your markup with the code shown on the Bootstrap example pageAll I see is this: http://cl.ly/image/2w0e0e1X1K0V
So I don’t know where your popover is supposed to occur.
January 12, 2013 at 8:42 pm #120824DesignLady94
MemberThat’s right…I don’t know why the popover isn’t displaying. I have used the code that I pasted above. I did include the bootstrap.css file…I don’t think I need any other css bootstrap files, as I didn’t need one for the accordion function.
Can you view my source code on the refer.php page? You will see the popover code there…it should be showing up right under the header on the left-hand side of the page.
January 12, 2013 at 8:45 pm #120825DesignLady94
MemberIf we can’t figure this out soon I think I’m going to give up on the popovers…they are not necessary…just would look nice. I’d rather concentrate more on why the internal link isn’t working in Firefox.
January 12, 2013 at 8:48 pm #120826TheDoc
MemberOohhhh. Are you supposed to hover over the ‘Testimonials’ title and see it?
January 12, 2013 at 8:51 pm #120827DesignLady94
MemberNo…maybe I am misunderstanding how this works….I *thought* from the example of static popovers on the Bootstrap page that they were just supposed to display with no clicking or anything. But nothing is showing up…I have been going round on this for a couple of days now.
January 12, 2013 at 8:58 pm #120828TheDoc
MemberOoohhhh. They are meant to be initialized by something with JS.
Yours isn’t showing because it’s set to `display: none;`. Having said that, you *shouldn’t* actually be writing any markup as it’s all done with the data attributes.
So what you *could* do, using the ‘Testimonials’ title as our reference, is this:
Testimonials
JS:
$(‘.your-toggle’).popover(‘show’);
January 12, 2013 at 8:59 pm #120829TheDoc
MemberI just tried the above on your site using Inspector and it worked perfectly.
January 12, 2013 at 9:08 pm #120830DesignLady94
MemberI see…it’s showing up now (I thought the ‘show’ option was for clicking on a button to display the popover.
I am now trying to figure out how to bring the title into the popover.
I am noticing that when I add the popover for the second reference it replaces the first….I think I’m going to give up on this…thanks for trying to help me out though!
January 12, 2013 at 9:22 pm #120831DesignLady94
MemberAm going with straight CSS to create the bubble. Thanks again Doc!
-
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.