You can pass html: true in initializing the popover (see 
http://twitter.github.com/bootstrap/javascript.html#popovers) and then pass 
HTML instead of plaintext in the data-content attribute.

Bill

On Nov 15, 2012, at 2:00 PM, Paul wrote:

> Hi,
> 
> Is it possible to have a popover with an image in the popover.
> 
> I have tried the following code, but can not get it to work:
> 
> <!DOCTYPE html> 
> <html lang="en"> 
> <head> 
> <meta charset="utf-8"> 
> <title>Twitter Bootstrap Popover Example</title> 
> <meta name="description" content="Creating Modal Window with Twitter 
> Bootstrap">
> <link href="bootstrap.css" rel="stylesheet"> 
> </head>
> <body>
> <div class="container">
> <h2>Example of creating Modal with Twitter Bootstrap</h2>
> <div class="well">
> 
> <img src='1.jpg'/>
> 
> <a href="#" id="example" class="btn btn-danger" rel="popover" 
> data-content="It's so simple to create a tooltop for my website!" 
> data-original-title="Twitter Bootstrap Popover">hover for popover</a>
> 
> <a href="#" id="example" class="btn btn-danger" rel="popover" 
> data-content="<img src='http://localhost/popover/1.jpg'/>" 
> data-original-title="Twitter Bootstrap Popover">zoom</a>
> 
> </div>
> <script src="jquery.min.js"></script>
> <script src="bootstrap-tooltip.js"></script>
> <script src="bootstrap-popover.js"></script>
> 
> <script>
> $(function ()
> { $("#example").popover({html : true});     
> });
> </script>
> </body>
> </html>
> 
> any help would be greatly appreciated
> 
> Regards,
> 
> 
> 
> Paul
> 

Reply via email to