Как определить атрибут «переполнение» - PullRequest
Новая
       0

Как определить атрибут «переполнение»

2 голосов
/ 15 мая 2011

Для элемента <svg>, который используется в IE9, атрибут style="overflow:hidden" очень важен.

К сожалению, когда объект svg создается с помощью jQuery svg-plugin с использованием следующего кода ... 

$('#svg').svg({onLoad: drawMap});

... этот атрибут не установлен, и изображение может быть нарисовано за пределами ограничивающего div (svg элемента).

Можно ли установить этот атрибут с помощью jQuery svg-plugin? Или я должен сделать это другим способом?

1 Ответ

1 голос
/ 15 мая 2011

После некоторого тестирования я пришел к этому решению, которое требует, чтобы overflow был установлен после отрисовки элемента SVG.Это упрощенный пример с использованием прилагаемого файла svgBasics.html, поставляемого с плагином: 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>jQuery SVG Basics</title>
<style type="text/css">
@import "jquery.svg.css";

#svgbasics { width: 100px; height: 100px; border: 1px solid #484; }
</style>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js"></script>
<script type="text/javascript" src="jquery.svg.js"></script>
<script type="text/javascript">
$(function() {
    $('#svgbasics').svg({onLoad: drawInitial});
});

function drawInitial(svg) {
    svg.circle(75, 75, 50, {fill: 'none', stroke: 'red', 'stroke-width': 3});
    var g = svg.group({stroke: 'black', 'stroke-width': 2});
    svg.line(g, 15, 75, 135, 75);
    svg.line(g, 75, 15, 75, 135);
    $('#svgbasics').css({'overflow' : 'hidden'});
}

</script>
</head>
<body>
<div id="svgbasics"></div>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...