Не отображается часть изображения
Здравствуйте!
Подскажите пожалуйста. Проблема следующая, при наведении курсора на ссылку появляется изображение, но не полностью, часть изображения почему-то обрезана. Ссылки созданы на траектории окружности при помощью SVG. При наведении на ссылку pushkin должен появлятся круг, но появляется только 1/4 его часть. http://hkar.ru/FXMi При наведении курсора на две другие ссылки должна появлятся оружность, но она тоже появляется не целиком. http://hkar.ru/FXMj Код: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <style> a object data { visibility: hidden; } a:hover object data { visibility: visible; } </style> <object data="link0.svg" type="image/svg+xml" width="190" height="190" style="position: absolute; z-index: 110!important; ; top: 420px; left: 575px;" > </object> <object data="link.svg" type="image/svg+xml" width="330" height="330" style="position: absolute; opacity: 1; z-index: 100!important; ; top: 300px; left: 460px;" > </object> </body> </html> Превая ссылка "link0.svg" <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="190" height="190"> <title>Текст вдоль траектории</title> <desc> Чтобы линии были не видны, элементы path следует заключить в контейнер defs </desc> <defs> <path id="link0" d="M10,30 L65,30" stroke="grey" fill="none" /> </defs> <style> a image { visibility: hidden; } a:hover image { visibility: visible; } </style> <a xlink:href="http://http://pushkin.niv.ru" xlink:show="new"> <text font-size="17" font-family="arial" fill=" #0000FF"> <textPath xlink:href="#link0" startOffset="0%"> pushkin.niv.ru </textPath> </text> <image xlink:href="images/okr1.png" height="190" width="190" x="-65" y="-67"/> </a> </svg> Две другие ссылки "link0.svg": <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="330" height="330"> <path id="link1" d="M20,150 A130,130 0 1,1 20,150.01" stroke="grey" fill="none"/> <style> a image { visibility: hidden; } a:hover image { visibility: visible; } </style> <a xlink:href="http://www.tolstoy.ru" xlink:show="new"> <text font-size="16" font-family="arial" fill=" #0000FF"> <textPath xlink:href="#link1" startOffset="0%"> tolstoy.ru </textPath> </text> <image xlink:href="images/okr2.png" height="330" width="330" x="-18" y="-15"/> </a> <a xlink:href="http://www.lermontov.niv.ru" xlink:show="new"> <text font-size="16" font-family="arial" fill=" #0000FF"> <textPath xlink:href="#link1" startOffset="19%"> lermontov.niv.ru </textPath> </text> <image xlink:href="images/okr2.png" height="330" width="330" x="-18" y="-15"/> </a> </svg> Также все файлы разместил здесь: https://yadi.sk/d/NMvbqOdcmjz5F |
|
laimas, спасибо! Задание нужных параметров для viewBox всё решило!
|
Часовой пояс GMT +3, время: 18:22. |