關於禁止圖片拖動的問題

最近在做一個公司的搶紅包項目，會在頁面上下紅包雨，玩家點擊紅包來玩搶紅包，但是當玩家在急促的點擊中很容易觸發圖片的拖動，而在火狐瀏覽下瀏覽器下又有默認的圖片拖動手勢支持，火狐一拖動圖片就會在新窗口打開圖片，而IE而更BT，直接打開圖片下載窗口，嚴重影響用戶體驗。

一開始想用css來解決，給圖片加上img{ pointer-events: none;} ,在火狐下可以解決，但是在IE下不起作用，后來幾翻折騰，還是用JS來解決，給圖片或者其父級都加上ondragstart="return false;"

<a class='redbagclass' ondragstart='return false;' href='javascript:void(0);'><img src='' /></a>

但同時又遇到一個問題，在點擊圖片不小心拖動的時候，會選中下面的圖片跟文字，總感覺怪怪的，百度幾翻后發現給BODY加上onselectstart="return false;" unselectable="on" style="-moz-user-select:none;"可以解決這樣的問題，unselectable為IE准備,onselectstart為Chrome、Safari准備,-moz-user-select是FF的。但是考慮到這個紅包雨效果是現官網的每個頁面都是需要增加的，通過PHP引入的，同時給BODY加感覺也會影響整站的選擇功能，太危險，於是考慮到給我的整個紅包模塊外包一層DIV，再給DIV綁定以上屬性，至此解決。

<div class="redbgcon">
        <div class="lockbgclass" id="lockbg" onselectstart="return false;" unselectable="on" style="-moz-user-select:none;">
        </div>
        <div class="people" id="peopleid" style="display:none">
            <img src="redbag/walk0.png" ondragstart="return false;">
        </div>
        <div class="timeleft" id="counttimeid" style="display:none">3</div>
    </div>

個人知識有限，如有更好的方法望不吝分享，共同學習，共同進步！