IE совместимость с jQuery Tools Tooltip

Question

Я начал проектировать страницу, используя подсказку jQuery Tools ( как показано здесь).

Я немного поработал, чтобы позволить onClick показывать и onClick скрывать. Прекрасно работает в Chrome, Safari и Firefox.

Но он не будет работать в IE 9, несмотря на то, что инструменты jquery предназначены для ОЧЕНЬ кросс-браузерной совместимости.

Сценарий, который я использовал:

  $(function() {
      // initialize tooltip
      var tooltip = $("#cog").tooltip({
        tipClass: 'usermenu',
        effect: 'slide', 
        bounce: true, 
        direction: 'down', 
        slideOffset: 10, 
        offset: [-5,-38], 
        delay: 500, 
        position: 'bottom center', 
        relative: true,
        events: {
              def:     ",",    // default show/hide events for an element
              input:   ",",               // for all    input elements
              widget:  ",",  // select, checkbox, radio, button
              tooltip: ","     // the tooltip element
              },
        onBeforeShow: function() {
        document.getElementById("cog_img").classList.toggle('inactive_cog_img');
        document.getElementById("cog_img").classList.toggle('active_cog_img');
        },
        onHide: function() {
        document.getElementById("cog_img").classList.toggle('inactive_cog_img');
        document.getElementById("cog_img").classList.toggle('active_cog_img');
        }
        });
    tooltip.click(function() {
        var tip = $(this).data("tooltip");
        if (tip.isShown(true))
            tip.hide();
        else
            tip.show();
    });


});

куда #cog это триггер,usermenu это всплывающая подсказка DIV

чтобы увидеть его вживую, я сделал пример страницы: http://test.theshananway.com/test.html (см. шестерню справа вверху)

Пожалуйста, помогите мне найти способ заставить его работать в IE, или дайте мне знать, если есть альтернатива IE?

Спасибо!

Answer 1

IE не нравится это свойство.classList... Попробуйте это:

$('#cog_img').toggleClass("inactive_cog_img").toggleClass("active_cog_img");

Вместо этого:

document.getElementById("cog_img").classList.toggle('inactive_cog_img');
document.getElementById("cog_img").classList.toggle('active_cog_img');