2015-11-04 30 views
1

嗨我創建一個結帳表單,我想添加一個工具提示以顯示在哪裏可以找到信用卡的CVV。將圖像添加到zurb基礎的工具提示

因此,如果人們將鼠標懸停在工具提示上,然後在彈出窗口中顯示圖像,那可能嗎?

回答

1

原來,您可以將HTML添加到title標記。您可以添加標籤<img>像這樣:

<span data-tooltip aria-haspopup="true" class="has-tip" title="<img src='http://placehold.it/350x150'> Tooltips are awesome, you should totally use them!">extended information</span> 

enter image description here

這裏有一個working demo

+3

這似乎不與基金會6.2工作,它返回的代碼,而不是呈現工具提示中的img。 – user2239318

+0

我不得不按照這個[PR](https://github.com/zurb/foundation-sites/pull/8075/commits/ae2129f859f0ea49392c0dc5a5d5db87c179761d)來獲得HTML在F6工具提示中的工作(小心確保只有可信的代碼將會在工具提示中以避免注入問題 - 請參閱[本主題](http://foundation.zurb.com/forum/posts/38057-tooltip-foundation-6-does-not-accept-html-tags) – waffl