Нужен совет по корректировке скрипта

 
Посетитель
no avatar
МедальАвторитет форума
Сообщений: 2776
Есть скрипт. он меняет вид логотипа при наведении на блок, а именно за это отвечает строка elem_other.animate({'d': "M17"}, animation_duration, animation_easing);, где 'd': "M17" - это SVG картинка. Вот вместо этого кода как вывести путь до обычной phg картинки?
Код JAVA:
  1. function toggleLeftSideBar(force_state) {// force_state 3 for toggle
  2. if((left_side_bar_can_be_hovered)&&(force_state!=left_side_bar_opened)) {
  3. var animation_easing = mina.easeinout,
  4. animation_duration = 300
  5. ;
  6. clearInterval(left_side_bar_interval);
  7. if(jQuery('#left_container').hasClass('hovered')) {
  8. var animatingLogo = Snap('#logo_svg'),
  9. elem_H = animatingLogo.select('#logo_h');
  10. //elem_H.animate({'d': "M16,10.7l0,10.7h16V10.7h5.3v26.7H32V26.7H16v10.7h-5.3V10.7H16z"}, animation_duration, animation_easing);
  11. elem_H.animate({ transform: "s0.89,10,20"}, animation_duration, animation_easing);
  12. elem_other = animatingLogo.select('#logo_other');
  13. elem_other.animate({'d': "M47"}, animation_duration, animation_easing);
  14. jQuery('#left_container').removeClass('hovered');
  15. left_side_bar_opened = 0;
  16. left_side_bar_may_click = false;
  17. } else {
  18. var animatingLogo = Snap('#logo_svg'),
  19. elem_H = animatingLogo.select('#logo_h');
  20. //elem_H.animate({'d': "M17,39h-6V9h6l0,12l18,0V9h6v30h-6V27H17V39z"}, animation_duration, animation_easing);
  21. elem_H.animate({ transform: "s1,0,0"}, animation_duration, animation_easing);
  22. elem_other = animatingLogo.select('#logo_other');
  23. elem_other.animate({'d': "M17"}, animation_duration, animation_easing);
  24. jQuery('#left_container').addClass('hovered');
  25. left_side_bar_opened = 1;
  26. setInterval(function(){left_side_bar_may_click = true},500);
  27. }
  28. }
  29. }
Посетитель
small user social cms
МедальПочетный донор проектаПочетный донор проекта
Сообщений: 607
Как отредактировать данный код не подскажу, но возможно подскажу решение..
Все это работает на спрайтах на вскидку что по яше выдал ссылка 1..
Из опыта подскажу, была у нас задача сделать смену дня и ночи в шапке в зависимости от времени суток, воспользовались спрайтами, я сейчас не вспомню что именно использовали из инструментов - но код формировали с помощью игрового движка, можете попробовать подобрать под ваши цели что нибудь например, аля такое ссылка 2
их много как программ работы со спрайтами так и более сложных и крупных инструментов.
Реклама
cms
Посетитель
small user social cms
МедальАвторитет форума
Сообщений: 1545
А пробовали просто поменять {'d': "M47"} на '<img src=".." />' ?
Посетитель
no avatar
МедальАвторитет форума
Сообщений: 2776
Lora:

А пробовали просто поменять {'d': "M47"} на '' ?

да, не работает
Посетитель
small user social cms
МедальАвторитет форума
Сообщений: 1545
Возможно потому, что Snap.svg работает только с файлами svg
Посетитель
small user social cms
МедальАвторитет форума
Сообщений: 1545
Сконвектируйте свою картинку в svg
Посетитель
no avatar
МедальАвторитет форума
Сообщений: 2776
Lora:
Возможно потому, что Snap.svg работает только с файлами svg
как вообще с ним работать с этим snap?) честно туплю сильно, не понимаю как со снапом работать
Посетитель
small user social cms
МедальАвторитет форума
Сообщений: 1545
Вот пример работы snap.svg сделал. Взял отсюда

PS.Покажите svg код в html
Редактировалось: 2 раз (Последний: 28 января 2017 в 22:14)
Посетитель
no avatar
МедальАвторитет форума
Сообщений: 2776
Lora:
Вот пример работы snap.svg сделал. Взял отсюда

PS.Покажите svg код в html
это я читал, но вообще не понял как оно работает. жаль, что нет сервиса, который бы позволил автмоатизировать процесс.
В начало страницы
Предыдущая темаСледующая тема Перейти на форум:
Быстрый ответ
Чтобы писать на форуме, зарегистрируйтесь или авторизуйтесь.