I really like this new functionality of the SharePoint search that shows you a preview on mouse hover. Is there a way to initialize this myself?

If I hover over an anchor tag can I, for example, call a JavaScript function and pass the page URL I want previewed in the flyout? Maybe someone can explain if this is reusable for custom markup.

Edit: Upon further inspection, I notice the search result div has a mouseover

onmouseover="EnsureScriptParams('SearchUI.js', 'HP.Show',  'ctl00_ctl40_g_842f2f47_d8d1_418d_8063_fb213934acf8_csr2_item', 'ctl00_ctl40_g_842f2f47_d8d1_418d_8063_fb213934acf8_csr2_hover', '~sitecollection\u002f_catalogs\u002fmasterpage\u002fDisplay Templates\u002fSearch\u002fItem_Site_HoverPanel.js', false);"

Any tips on reusing this manually?


Yes, The Display Templates both the Result and the Result Hover are just HTML and JavaScript. The default previews are either generated by Office Web Apps (the WOPI Server) or through the iframe of the site. All you need to do is decide what you want to call and how you want to display the preview.

This post can get you started with the process: http://www.ableblue.com/blog/archive/2013/06/05/introduction-to-sharepoint-2013-display-templates/

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.