Wheelnav. js, не выбран по умолчанию NavItemText

Question

Я пытаюсь использовать Wheelnav. js. в виде простого меню в виде ссылки на другие страницы сайта.

В настоящее время первое меню моего колеса выбрано по умолчанию. Но я бы не хотел, чтобы меню выбиралось по умолчанию.

пример 1 https://infinistudio.ch/exemple-menu-5-desktop.m4v

Я использую navitemtext для размещения внешних ссылок на заголовки. Но ссылки на внешние страницы, кажется, не работают каждый раз.

, и я пытаюсь поместить заголовок и описание в две строки, чтобы я мог поместить два разных стиля. цель состоит в том, чтобы получить заголовок и описание из меню WordPress.

пример кода кода

<nav>
  <div id='piemenu' data-wheelnav
                data-wheelnav-slicepath='NullSlice'
                data-wheelnav-navangle='270'
                data-wheelnav-cssmode
                data-wheelnav-rotateoff 
                data-wheelnav-init>

        <?php foreach ($menu_items as $item) : ?>
        <div data-wheelnav-navitemtext='<?= $item['title'] ?>'\n<?= $item['description'] ?> >

                <a href="<?= $item['url'] ?>" title="<?= $item['title'] ?>"><?= $item['title'] ?></a>

        </div>  
        <?php endforeach; ?>
     <div>
</nav>

Answer 1

<script type="text/javascript">
window.onload = function () {

    var wheel = new wheelnav('piemenu');
    wheel.sliceInitPathFunction = wheel.slicePathFunction;
    wheel.initPercent = 0.1;
    wheel.wheelRadius = wheel.wheelRadius * 1.7;
    wheel.selectedNavItemIndex = null;  
    wheel.createWheel();
    };
</script>
<nav>
<div id='piemenu' data-wheelnav
            data-wheelnav-slicepath='NullSlice'
            data-wheelnav-navangle='270'
            data-wheelnav-cssmode
            data-wheelnav-rotateoff 
            data-wheelnav-init>

    <?php $menu_items = wp_get_menu_array('9'); ?>
    <?php foreach ($menu_items as $item) : ?>

        <div data-wheelnav-navitemtext='<?= $item['title'] ?><?= $item['description'] ?>'>
            <a href="<?= $item['url'] ?>" title="<?= $item['title'] ?>"><?= $item['title'] ?></a>          
        </div>            
    <?php endforeach; ?>               
<div>
</nav>

resultat html: ссылка "Rendez-vous" не работает, например.

<nav>
<div id='piemenu' data-wheelnav
            data-wheelnav-slicepath='NullSlice'
            data-wheelnav-navangle='270'
            data-wheelnav-cssmode
            data-wheelnav-rotateoff 
            data-wheelnav-init>

                <div data-wheelnav-navitemtext='L esperluette(en moins d’une minute)'>
            <a href="http://localhost:8888/lesperluette.fr/" title="L esperluette">L esperluette</a>          
        </div>            
            <div data-wheelnav-navitemtext='Rendez-vous'>
            <a href="http://localhost:8888/lesperluette.fr/bousole7/" title="Rendez-vous">Rendez-vous</a>          
        </div>            
            <div data-wheelnav-navitemtext='07 Boussole 7'>
            <a href="http://localhost:8888/lesperluette.fr/bousole7/" title="07 Boussole 7">07 Boussole 7</a>          
        </div>            
            <div data-wheelnav-navitemtext='05 test menu'>
            <a href="http://localhost:8888/lesperluette.fr/bousole5/" title="05 test menu">05 test menu</a>          
        </div>            
            <div data-wheelnav-navitemtext='04 Qui sommes nous ?'>
            <a href="http://localhost:8888/lesperluette.fr/bousole44/" title="04 Qui sommes nous ?">04 Qui sommes nous ?</a>          
        </div>            
            <div data-wheelnav-navitemtext='Exemple externe 1'>
            <a href="http://www.youtube.com" title="Exemple externe 1">Exemple externe 1</a>          
        </div>            
            <div data-wheelnav-navitemtext='Exemple interne'>
            <a href="http://localhost:8888/lesperluette.fr/" title="Exemple interne">Exemple interne</a>          
        </div>            
            <div data-wheelnav-navitemtext='Contact'>
            <a href="#" title="Contact">Contact</a>          
        </div>            

<div>
</nav>

Answer 2

Вы должны использовать свойство selectedNavItemIndex в JavaScript.

Когда оно равно NULL, по умолчанию нет выбранного navitem.

var wheel = new wheelnav("piemenu");
wheel.selectedNavItemIndex = null;
wheel.createWheel();

Второй проблемой со ссылками была ошибка в парсер. Я исправил это, последняя версия доступна на GitHub: https://github.com/softwaretailoring/wheelnav