在 web 端我們檢視一些資料時，為了友善使用者了解資料的計算方法，會在滑鼠指向格子的時候出現一些提示，滑鼠移開的時候提示就不顯示了，再比如說，滑鼠指向頁面按鈕，出現按鈕功能的提示，這樣的效果在潤乾中可以輕松實作，也有相應的文檔介紹 滑鼠懸停出現提示資訊怎麼做 。
除了上面說的那種靜态資訊外，在潤乾報表中也可以實作滑鼠指向顯示對應的動态資料，還可以實作滑鼠指向顯示圖檔的效果哦！
這裡以學生資訊表為例，實作滑鼠指向不同人員的照片，可以在旁邊顯示出相應的大圖。
具體實作方法
制作一張學生資訊表
資料庫中存的人員基本資訊是在一條記錄裡，而我們常見的人員資訊表是将一條記錄裡的資料在不同行中顯示，這種報表相對于網格式報表來說格式更加随意，我們稱之為自由報表，關于如何實作自由格式報表可以參考資料庫中的圖檔字段怎麼在報表中呈現 （圖檔字段呈現） 。
報表模闆設計如下圖所示
增加要顯示的圖檔的圖層
在報表中追加一列，将 J2~J6 合并單元格，并将合并後的 J2 單元格資料類型設定為 html, 單元格的内容為：
="
人員資訊高清免冠證件照
"
頁面中增加滑鼠懸停時圖層的樣式
在 showReport.jsp 中增加如下的樣式：
sjbb_hover{ padding: 10px 10px 10px 10px;
border-radius: 3px;
box-shadow: 0px 0px 2px #ccc;
background: #fff;
color: #000;
position: absolute;
text-align: center;
display: inline-block;
left: 532px;
top: 47px;} 頁面中增加圖層的顯示隐藏的 JS 方法
$("#sjbb_hover").hide();
function show()
{
$("#sjbb_hover").show();
}
function hide()
$("#sjbb_hover").hide(); 在報表中給圖檔增加 html 事件
選中 H2，設定 HTML 事件為 onmouseover=‘show()’ onmouseout=‘hide()’
經過以上設定我們就完成了滑鼠懸停顯示圖檔的需求了。
浏覽器中通過
http://localhost:6868/demo/reportJsp/showReport.jsp?rpx=學生資訊表.rpx 就可以看到效果了。
翻頁檢視另一人的資訊時，滑鼠指向是對應人員的照片。
通過這樣的設定，我們還可以實作滑鼠指向，顯示個二維碼，使用者可以通過手機掃碼二維碼，在手機上檢視更多需要了解的資訊。