2017-11-16 9 views
1

私はウェブサイトを開発していますが、UIの部分でうまくいきません。とにかくイラストレーターからSVGファイルを取得してjqueryを使用していますが、正しく操作していませんブラウザ、SVGは、Adobeのプレビューが<object>を使用して、アドビイラストレーターの「プレビュー」よりも大きいですが、jQueryの中で、私はここに直接jveryでsvgをスケーリング

SVGファイルをロードしています私のSVGファイルの先頭には、

<?xml version="1.0" encoding="iso-8859-1"?> 
    <!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 
    6.00 Build 0) --> 
    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" 
    xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1024 768" 
    style="width:1024;height:768;"> 

ですここに私のコードの開始です

<!doctype html> 
<html> 
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile- 
1.0.1.min.js"></script> 
<script> 
$.get('new.svg', function(data) { 
$(document.body).append(data.documentElement); 
$('#TESTGROUPCIRCLE').on('click touchstart', function() { 
$('#tooltip').hide(); 
$('#TESTTEXT').fadeIn(); 
$('#MAIN').fadeOut(); 
    }); 

<object>を使わずにsvgが大きく表示される理由はわかりませんが、それは私が知らない理由で1333 * 999で表示されます。

答えて

0

正しいサイズでsvgを表示するには、style="width:1024;height:768"のimgタグを使用する必要があります。 imgタグを持たずに身体にsvg権利を追加しています。 あなたのnew.svgが同じソースにあることがわかります。だから、jQueryでロードする必要はありません。

+0

ご挨拶、ごめんなさい、私はimgタグを使って読み込んでみましたが、私がJQUERYで直接読み込んだようなsvgドキュメント要素を操作できませんでした。ごめんなさい。ウェブ、私がしようとしているのは、svgベースのランディングページをデザインしていますが、Adobe Illustratorから幅と高さを小さくする必要があると思いますか?問題? –

関連する問題