function toggleLeftSideBar(force_state) {// force_state 3 for toggle if((left_side_bar_can_be_hovered)&&(force_state!=left_side_bar_opened)) { var animation_easing = mina.easeinout, animation_duration = 300 ; clearInterval(left_side_bar_interval); if(jQuery('#left_container').hasClass('hovered')) { var animatingLogo = Snap('#logo_svg'), elem_H = animatingLogo.select('#logo_h'); //elem_H.animate({'d': "M16,10.7l0,10.7h16V10.7h5.3v26.7H32V26.7H16v10.7h-5.3V10.7H16z"}, animation_duration, animation_easing); elem_H.animate({ transform: "s0.89,10,20"}, animation_duration, animation_easing); elem_other = animatingLogo.select('#logo_other'); elem_other.animate({'d': "M47"}, animation_duration, animation_easing); jQuery('#left_container').removeClass('hovered'); left_side_bar_opened = 0; left_side_bar_may_click = false; } else { var animatingLogo = Snap('#logo_svg'), elem_H = animatingLogo.select('#logo_h'); //elem_H.animate({'d': "M17,39h-6V9h6l0,12l18,0V9h6v30h-6V27H17V39z"}, animation_duration, animation_easing); elem_H.animate({ transform: "s1,0,0"}, animation_duration, animation_easing); elem_other = animatingLogo.select('#logo_other'); elem_other.animate({'d': "M17"}, animation_duration, animation_easing); jQuery('#left_container').addClass('hovered'); left_side_bar_opened = 1; setInterval(function(){left_side_bar_may_click = true},500); } } }
#1
28 января 2017 в 09:46
Есть скрипт. он меняет вид логотипа при наведении на блок, а именно за это отвечает строка elem_other.animate({'d': "M17"}, animation_duration, animation_easing);, где 'd': "M17" — это SVG картинка. Вот вместо этого кода как вывести путь до обычной phg картинки?
#2
28 января 2017 в 10:51
Как отредактировать данный код не подскажу, но возможно подскажу решение..
Все это работает на спрайтах на вскидку что по яше выдал ссылка 1..
Из опыта подскажу, была у нас задача сделать смену дня и ночи в шапке в зависимости от времени суток, воспользовались спрайтами, я сейчас не вспомню что именно использовали из инструментов — но код формировали с помощью игрового движка, можете попробовать подобрать под ваши цели что нибудь например, аля такое ссылка 2
их много как программ работы со спрайтами так и более сложных и крупных инструментов.
Все это работает на спрайтах на вскидку что по яше выдал ссылка 1..
Из опыта подскажу, была у нас задача сделать смену дня и ночи в шапке в зависимости от времени суток, воспользовались спрайтами, я сейчас не вспомню что именно использовали из инструментов — но код формировали с помощью игрового движка, можете попробовать подобрать под ваши цели что нибудь например, аля такое ссылка 2
их много как программ работы со спрайтами так и более сложных и крупных инструментов.
#3
28 января 2017 в 14:10
А пробовали просто поменять {'d': "M47"} на '<img src=".." />'?
Сегодня в 07:32
#4
28 января 2017 в 14:54
А пробовали просто поменять {'d': "M47"} на '' ?
да, не работает
#5
28 января 2017 в 15:21
Возможно потому, что Snap.svg работает только с файлами svg
#6
28 января 2017 в 15:23
Сконвектируйте свою картинку в svg
#7
28 января 2017 в 16:00
как вообще с ним работать с этим snap?) честно туплю сильно, не понимаю как со снапом работатьВозможно потому, что Snap.svg работает только с файлами svg
#9
29 января 2017 в 11:40
это я читал, но вообще не понял как оно работает. жаль, что нет сервиса, который бы позволил автмоатизировать процесс.Вот пример работы snap.svg сделал. Взял отсюда
PS.Покажите svg код в html