Jump to content

Иван98

Newbie
 View Profile  See their activity

  • Posts

    20

  • Joined

  • Last visited

 Content Type 

Everything posted by Иван98

  1. Иван98
    Спасибо за помощь!!!
  2. Иван98
    Всё получилось!!! Кому интересно вот ссылка: http://codepen.io/Ivan545/pen/BKwxPy
  3. Иван98
    Спасибо, буду пробовать.
  4. Иван98
    Друзья,всем добрый день! Помогите пожалуйста разобраться. Имеется фоновое изображение и подложка сайта на которой размещены кнопки. Необходимо чтобы за кнопками отсутствовала подподложка, а рядом где кнопки отсутствуют она осталась. Хотелось бы чтобы было вот так: http://hkar.ru/HHwR Сам код вот здесь: http://codepen.io/Ivan545/pen/reGdQe
  5. Иван98
    Игорь, большое вам спасибо за помощь!!!
  6. Иван98
    Попробовал, совсем перестало выводить изображения http://codepen.io/anon/pen/NNRqvR
  7. Иван98
    Туда к сожалению не залить изображения. Вот пожалуйста http://codepen.io/anon/pen/qZaEeY
  8. Иван98
    Здравствуйте, товарищи! Есть две ссылки каждая размещена в отдельном svg. При наведении на одну ссылку (pushkin) должно появляется фоновое изображение в виде круга синего цвета, при наведении на другую (lermontov.info) появляется фоновое изображение уже в виде окружности зелёного цвета. На деле правильно отображается лишь изображение при наведении на ссылку lermontov.info, а при наведении на ссылку pushkin вместо синего круга отображается окружность зелёного цвета. Подскажите пожалуйста как это исправить. <!DOCTYPE html><html><head></head><body><svg type="image/svg+xml" width="190" height="190" style="position: absolute; opacity: 1; z-index: 110!important; ; top: 155px; left: 118px;"xmlns="http://www.w3.org/2000/svg" version="1.1"xmlns:xlink="http://www.w3.org/1999/xlink" width="190" height="190" viewBox="-59 -67 190 190" > <style> a:hover {background-image: url('okr1.png'); background-size: cover;} </style> <path id="link0" d="M10,30 L65,30" stroke="grey" fill="none" /><a xlink:href="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></a></svg > <svg type="image/svg+xml" width="330" height="330" style="position: absolute; opacity: 1; z-index: 100!important; ; top: 85px; left: 48.5px; " xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" > <style> svg:hover {background-image: url('okr2.png'); background-size: cover;} </style> <path id="link1" d="M20,150 A130,130 0 1,1 280,150" stroke="transparent" fill="none" /> <a xlink:href="http://lermontov.info" xlink:show="new"><text font-size="17" font-family="arial" fill=" #0000FF"><textPath xlink:href="#link1" startOffset="18%">lermontov.info</textPath></text></a></svg > </body></html>Картинка при наведении курсора на ссылку pushkin. Хотя исходно изображение которое указано в коде выглядит так: Во вложении сама страница с изображениями: https://yadi.sk/d/bwGFEsg9q7KjY
  9. Иван98
    Здравствуйте! Помогите пожалуйста разобраться. Необходимо чтобы при наведении курсора на ссылку появлялся DIV находящийся на другой странице, что я попытался сделать при помощи следующего скрипта: onmouseover="document.getElementById('opis').style.display='block'" onmouseout="document.getElementById('opis').style.display='none'"При помещении кода на одну страницу всё работает. http://codepen.io/anon/pen/reNZMb Но при размещении div на другой странице он не выводится. index.html: <!DOCTYPE html><body><object data="link0.svg" type="image/svg+xml" width="190" height="190" style="position: absolute; opacity: 1; z-index: 110!important; ; top: 355px; left: 518px;" ></object><div id="opis" style="display:none">Poiskovaiy systema.</div></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"><svgxmlns="http://www.w3.org/2000/svg" version="1.1"xmlns:xlink="http://www.w3.org/1999/xlink" width="190" height="190" viewBox="-59 -67 190 190"> <defs><path id="link0" d="M10,30 L65,30"stroke="grey" fill="none" /></defs><a xlink:href="http://ya.ru" xlink:show="new" onmouseover="document.getElementById('opis').style.display='block'" onmouseout="document.getElementById('opis').style.display='none'"><text font-size="17" font-family="arial" fill=" #0000FF"><textPath xlink:href="#link0" startOffset="0%">ya.ru</textPath></text></a></svg>
  10. Иван98
    Я так тоже пробывал, но к сожалению когда ссылок больше чем одна, при переводе курсора с одной ссылки на другую предыдущая исчезает. http://codepen.io/anon/pen/PZjxVR
  11. Иван98
    Здравствуйте! Подскажите пожалуйста. При наведении курсора на ссылку появляется картинка, но она перекрывает ссылку. ДО наведения курсора http://hkar.ru/G26z После наведения курсора http://hkar.ru/G26A Хотя в стилях для картинки задано: a image {visibility: hidden; position: absolute; z-index:1;}А для ссылки при наведении: a:hover text {text-decoration: underline; position: absolute; z-index:100;}Весь код: <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <svgxmlns="http://www.w3.org/2000/svg" version="1.1"xmlns:xlink="http://www.w3.org/1999/xlink"width="330" height="330" viewBox="-18 -15 330 330"><path id="link1" d="M20,150 A130,130 0 1,1 20,150.01"stroke="grey" fill="none"/><style> a image {visibility: hidden; position: absolute; z-index:1;} a:hover image {visibility: visible;} a:hover text {text-decoration: underline; position: absolute; z-index:100;} </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></svg> <object data="link.svg" type="image/svg+xml" width="400" height="400" style="position: absolute; opacity: 1; ; top: 300px; left: 460px;" ></object></body></html>Также код вот здесь: http://codepen.io/anon/pen/vLZxea Заранее спасибо за помощь.
  12. Иван98
    Igor Schnaider, огромнейшее спасибо за помощь, всё робит!.http://codepen.io/anon/pen/BjRqBo
  13. Иван98
    Здравствуйте! Подскажите пожалуйста. При наведении на ссылку и при её нажатии должен по-идее изменятся её цвет, но этого не происходит. http://hkar.ru/FZ9f <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body><object data="link.svg" type="image/svg+xml" width="500" height="500" style="position: absolute; opacity: 1; z-index: 100!important; ; top: 285px; left: 442px;" ></object></body></html> <?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"><svgxmlns="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:visited {color: #FF0000;} a:hover {color: #FFA500; }</style><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></a></svg>Файлы во вложенииhttps://yadi.sk/d/1PCUB5_nmm3P5
  14. Иван98
    Igor Schnaider, в очередной раз огромное вам спасибо!!! задание нужных параметров для viewBox всё решило!
  15. Иван98
    Здравствуйте! Подскажите пожалуйста. Проблема следующая, при наведении курсора на ссылку появляется изображние, но не полностью, часть изображения почему-то обрезана. Ссылки созданы на траектории окружности при помощью SVG. При наведении на ссылку pushkin должен появлятся круг, но появляется только 1/4 его часть. http://hkar.ru/FXMi При наведении курсора на две другие ссылки должна появлятся оружность, но она тоже появляется не целиком. http://hkar.ru/FXMj Все файлы разместил здесь: https://yadi.sk/d/NMvbqOdcmjz5F
  16. Иван98
    Спасибо, с позиционированием разобрался.
  17. Иван98
    Добрый день, друзья! Помогите пожалуйста разобраться. При наведении курсора на ссылку появляется изображение, но не в том месте где нужно. При позиционировании картинки через "x" и "y" часть изображения почему-то обрезается. <image xlink:href="images/okr1.jpg" width="100%" height="100%" x="200" y="100"/> Хотелось чтобы картинка целиком появлялаяь снизу под окружностью. Ниже весь размещён код: <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <object data="link.svg" type="image/svg+xml" width="400" height="450" ></object></body></html><svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="400" height="400"> <title></title> <desc></desc> <style> a image { visibility: hidden; } a:hover image { visibility: visible; } </style> <path id="mypath2" d="M50,150 A130, 130 0 1,1 50,150.01" stroke="grey" fill="none"/> <a class="okrug" xlink:href="http://www.ya.ru" xlink:show="new"> <text font-size="17" font-family="arial" fill=" #0000FF"> <textPath xlink:href="#mypath2" startOffset="35%">ya.ru</textPath> </text> <image xlink:href="images/okr1.jpg" width="100%" height="100%" x="200" y="100"/> </a></svg>Заранее спасибо за помощь.
  18. Иван98
    Igor Schnaider, Большое вам спасибо!!!
  19. Иван98
    Доброго времени суток, люди добрые!!! Помогите пожалуйста. При наведении курсора на ссылку размещённую на окружности, нарисованной с помощью svg, должна по-идее появляться картинка, но она упортно этого делать не хочет. Помогите пожалуйста разобраться в причине. Все сопутствующие файлы во вложении. На обычной ссылке всё происходит как надо. <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <style> .okrug span{ position: absolute; left: 500px; z-index: 100!important; visibility: hidden; } .okrug:hover span{visibility: visible;} </style> <object data="link.svg" type="image/svg+xml" width="400" height="450" > </object><!--обычная ссылка--><a class="okrug" href="http://www.ya.ru" xlink:show="new">ya.ru<span><img src="images/okr1.jpg" style="position: absolute; " /></span></a></body></html>Вот и ссылочка моя, отказывающаяся работать: <?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"><svgxmlns="http://www.w3.org/2000/svg" version="1.1"xmlns:xlink="http://www.w3.org/1999/xlink"width="400" height="400"><title></title><desc></desc><path id="mypath2" d="M50,150 A130, 130 0 1,1 50,150.01"stroke="grey" fill="none"/><a class="okrug" xlink:href="http://www.ya.ru" xlink:show="new"><text font-size="17" font-family="arial" fill=" #0000FF"><textPath xlink:href="#mypath2" startOffset="35%">ya.ru<span><img src="images/okr1.jpg" style="position: absolute; top: 348px; left: 511px;" /></span></textPath></text></a></svg>Заранее благодарю за помощь!
  20. Иван98
    Здравствуйте! Помогите пожалуйста разобраться. Требовалось внести svg-код в html документ. Я не нашёл лучше способа как через <object>. <object data="link.svg" type="image/svg+xml" width="400" height="450"></object> В результате у меня при нажатии ссылок, находящихся в подключённом svg, открываются сайты не на полную страницу, а в окошке 400х450. Как этого избежать? Возможен ли тогда какой-либо другой способ вставки svg в html? <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>Растягиваемый фон</title> <style> body { background: url(images/loshad.png) no-repeat; -moz-background-size: 100%; /* Firefox 3.6+ */ -webkit-background-size: 100%; /* Safari 3.1+ и Chrome 4.0+ */ -o-background-size: 100%; /* Opera 9.6+ */ background-size: 100%; /* Современные браузеры */ } </style> </head> <body> <object data="link.svg" type="image/svg+xml" width="400" height="450"></object> </body></html>Страница во вложении: https://yadi.sk/d/f6qEBjP6cSxpd
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept