Не удается ввести основную функцию в HoverIntent

0

Мой проект состоит из меню, и я хотел бы, чтобы подменю отображалось ниже, когда мышь нависает над каждой кнопкой (hoverIntent). Я использую Wet-Boew (Web Experience Toolkit) (https://github.com/wet-boew/wet-boew) для создания этих функций.

Моя рабочая область проекта состоит из основной папки php проекта, включая индексный файл, который вызывает jquery.min.js, а затем hoverintent.js и menubar.js.

Ниже приведено начало hoverintent.js:

(function($) {
      // Alert Point A
$.fn.hoverIntent = function(f,g) {
                // Alert Point B
    // default configuration options
    var cfg = {
        sensitivity: 7,
        interval: 100,
        timeout: 0
    };
    // override configuration options with user supplied object
    cfg = $.extend(cfg, g ? { over: f, out: g } : f );

                etc...
     })

Моя проблема заключается в том, что, хотя я могу достичь первой переменной AI, имеющейся в моем коде (и может генерировать поле alter), программа не будет запускать функцию $.fn.hoverIntent = (f, g) {...} (где у меня есть вторая точка оповещения B). У меня есть аналогичная проблема с моей menubar.js (где основные функции кода не загружаются).

Как обычно это самый распространенный источник этой проблемы и лучший способ ее исправить?

Следует отметить, что я раньше вызывал jQuery в другой папке проекта php (все еще внутри рабочей области проекта), которая связана с отдельной программой входа в систему для этого программного обеспечения. Файл индекса переходит к программе входа в систему, чтобы получить учетные данные пользователя, прежде чем возвращать индексный документ для отображения основного содержимого.

Я убедился, что это был тот же самый файл jQuery, который я позже упоминал в файле индекса до hoverintent.js и menubar.js. Это то, что вызывает проблему?

Извините, у меня нет всего кода на данный момент, чтобы поделиться, я постараюсь, чтобы все остальное в ближайшее время. Заранее спасибо.

----------------ОБНОВИТЬ-------------------------------

В моем основном индексном файле есть голова со следующим кодом. Обратите внимание, что "../" требуется, так как папка проекта с мокрым каналом находится отдельно от основной папки проекта программы (индекс) в рабочей области:

<head>
<script src="../wet-boew-master/build/js/jquery.min.js" type="text/javascript"></script>

<script async="async" src="../wet-boew-master/build/js/dependencies/outside-min.js"></script>
<script async="async" src="../wet-boew-master/src/js/dependencies/hoverintent.js"></script>
<script async="async" src="../wet-boew-master/build/js/dependencies/equalheights-min.js"></script>
<script async="async" src="../wet-boew-master/build/js/dependencies/resize-min.js"></script>
<script async="async" src="../wet-boew-master/build/js/i18n/en-min.js"></script>

<script src="../wet-boew-master/src/js/workers/menubar.js" type="text/javascript"></script>

<title>Title of the Project</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="icon" type="image/ico" href="images/icon.ico">

<script src="../wet-boew-master/build/js/settings.js"></script>

<link href="../wet-boew-master/build/grids/css/util-min.css" rel="stylesheet"/>
<link href="../wet-boew-master/build/js/css/pe-ap-min.css" rel="stylesheet"/>
<link href="../wet-boew-master/build/.../css/theme-min.css" rel="stylesheet"/>
<noscript><link rel="stylesheet" href="../wet-boew-master/build/.../css/theme-ns-min.css" /></noscript></head>

Далее вниз, внутри тела индекса мы имеем строку меню:

<body>
  <div id="wb-body">
    <div id="wb-head">
      <div id="wb-head-in">
        <header>
          <div id="wu-bnr" role="banner">
            <nav role="navigation">
              <div id="wu-psnb" >
                <div id="wu-psnb-in">
                  <div class="wet-boew-menubar mb-mega" data-load="menubar" role="application" style="min-height: 28px;">
                    <div>
                      <ul data-ajax-replace="../wet-boew-master/demos/includes/menu-eng.txt" class="mb-menu" role="menubar">

В этот момент мои меню и их соответствующие подменю перечислены как таковые:

<li *class=""* role="presentation">
<section role="presentation">
    <h3 role="presentation">
        <a href="index.php?location=activitiesMenu:index" role="menuitem" class="knav-1-0-0 mb-has-sm" aria-haspopup="true">
            <span class="expandicon">
                <span class="sublink"><?=$glb_string["activities"]?></span>
            </span>
            <span class="wb-invisible">(open the submenu with the enter key and close with the escape key)</span>
        </a>
    </h3>
    <div *class="mb-sm"* role="menu" *aria-expanded="false"* *aria-hidden="true"* **id="myHoverIntent"**>
        <div class="span-2" role="presentation">
            <ul role="presentation">
                <li role="presentation"><a href="index.php?location=activitiesMenu:index" role="menuitem" class=" knav-1-0-1" tabindex="-1"><?=$glb_string["views"]?><?=($language_set_variable == 'fr'?:)?></a></li>
                <li role="presentation"><a href="index.php?location=activitiesMenu:create" role="menuitem" class=" knav-1-0-2" tabindex="-1"><?=$glb_string["create"]?><?=($language_set_variable == 'fr'?':')?></a></li>
            </ul>           
        </div>
    </div>
</section></li>

Будет ли это правильным местом для моего id = "MyHoverIntent" (Bold **) в коде выше?

Следует также отметить, что курсивный код (*) выше не изменяется (я предполагаю, что главные функции меню и hoverIntent не работают). Обычно это будет автоматически обновляться по мере того, как пользователь наводится на каждый вариант меню или оставляет его. Я знаю это из-за образца файла, который был включен в папку WET-BOEW, которая показывает полностью функционирующую страницу (с рабочим меню и hoverIntent), и эти изменения были отмечены в Firebug. Хотя по какой-то причине Firebug показал, что образец никогда не ссылался на menubar.js.

Теги:
menubar
hoverintent

1 ответ

0

Немного сложно сказать, что именно вы делаете, что перестает работать с вашим кодом, так как у нас есть только половина кода прямо сейчас, но на ум приходит кое-что. Во-первых, функция hoverIntent, когда вы на самом деле называете ее объектом jQuery

$('#myHoverIntent').hoverIntent();

Во-вторых, убедитесь, что вы этого не делаете до того, hoverIntent функция hoverIntent действительно будет определена и, наконец, убедитесь, что вы передаете window.jQuery в ваше мгновенное выражение функции

Вот сценарий рабочего примера: http://jsfiddle.net/G3vCS/

  • 0
    Том, я сделал обновления, чтобы показать больше моего кода в индексе выше. Я попытался включить: $ (function () {$ ('# myHoverIntent'). HovertIntent ();}) В hoverIntent.js, ниже остальной части кода (ниже (window.jQuery);) однако я получаю ошибку в моем Firebug: «TypeError: $ (...). hoverIntent не является функцией». Также моя ссылка на id = "myHoverIntent" в правильном расположении div? Именно здесь начинаются подменю для определенного выпадающего меню.
  • 0
    Я выяснил, как попасть в файл hoverintent.js, однако теперь я сталкиваюсь с двумя проблемами: я не уверен, какие два параметра я должен ввести для hoverIntent (). Обычно это $ ("myHoverIntent"). HoverIntent (showNav, hideNav); но это не указано в моем коде. На что бы я их поставил? Кроме того, внутри функции hoverintent.js я не могу ввести ни одну из частных функций, которые, как я полагаю, необходимы для кода: var track = function (ev) {alert ("I are here3"); cX = ev.pageX; cY = ev.pageY; }; var сравнение = функция (ev, ob) {...} var delay = функция (ev, ob) {...} и т. д ...

Ещё вопросы

Сообщество Overcoder
Наверх
Меню