Открыть модальное поле CSS из ссылки в документе SVG - PullRequest
0 голосов
/ 30 января 2012

Я хочу реализовать модальное поле в соответствии с http://www.paulrhayes.com/2011-03/css-modal/, которое открывается при нажатии на элемент в документе SVG.

Вот пример кода:

<svg ...>
<g id="ra">
    <a xlink:href="#r1" class="openModal">
        <g id="r">
            <rect x="136.63" y="98.893" fill="#000000" width="58.79" height="91.313"/>
        </g>
    </a>
</g>
</svg>
<aside id="r1" class="modal">
    <div>
        <h2>Modal box</h2>
            <p>Lorem Ipsum</p>
            <a href="#close" title="Close">Close</a>
    </div>
</aside>

Ну, как вы можете догадаться.Этот код не работает.Возможно, вы можете помочь?Большое спасибо.

1 Ответ

0 голосов
/ 30 января 2012

Вы просто забыли включить css? Это работает для меня, как только вы это сделаете.

<!DOCTYPE html>
    <html>
        <link rel="stylesheet" type="text/css" href="http://www.paulrhayes.com/experiments/modal/css/experiment.css"/>
        <svg>

        <a xlink:href="#r1" class="openModal">
            <g id="r">
                <rect x="136.63" y="98.893" fill="#000000" width="58.79" height="91.313"/>
            </g>
        </a>
    </g>
    </svg>
    <aside id="r1" class="modal">
        <div>
            <h2>Modal box</h2>
                <p>Lorem Ipsum</p>
                <a href="#close" title="Close">Close</a>
        </div>
    </aside>
    </html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...