jQueryの、attrメソッドは自動的にlowercase(小文字化)するため、SVGのviewBox(viewboxではなく)属性を変更できない。 そのため、以下のようにsetAttributeを利用し、設定する必要がある。
![【jQuery】SVGのviewBoxでハマる - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/221d6c8fbcaf638d73ba64d2794c158c78fff7ad/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JUUzJTgwJTkwalF1ZXJ5JUUzJTgwJTkxU1ZHJUUzJTgxJUFFdmlld0JveCVFMyU4MSVBNyVFMyU4MyU4RiVFMyU4MyU5RSVFMyU4MiU4QiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9MTJjNmJjOGIyNWQzNmMzZjdmODU1MjYzODgyODY3OTU%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDAzdXBqcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9YTlkOGIyNDEwN2U4MmU0N2UwMWMxZjI3MTVjNjg2ZWQ%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3Db445b1b3e4cc9070c81a1a92dd1af3b7)
jQueryの、attrメソッドは自動的にlowercase(小文字化)するため、SVGのviewBox(viewboxではなく)属性を変更できない。 そのため、以下のようにsetAttributeを利用し、設定する必要がある。
Tomomi Imura An Open Web advocate and front-end engineer, who loves everything mobile, and writes about HTML5, CSS, JS, UX, tech events, gadgets, etc. She unintentionally got 15min of fame by creating The HTTP Status Cats. Also, the opinions expressed here are solely her own and do not express the views or opinions of my employer. Twitter LinkedIn Instagram Github Flickr My articles are licensed u
WindowsでもMacでも同じフォントが使えるということで游ゴシックを試してみたのですが、IEでレイアウトがずれてしまいました・・・。 キャプチャを見てもらえれば分かるかと思うのですが、文字の下に謎の余白?が出来てしまっています MSコミュニティにもこんな質問があがっていました。 IEで「游ゴシック/游明朝」を表示させると、文字の下側に由来不明の余白が生じる 相変わらずIE先輩には悩まされますね・・・ 検証コード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>游書体テスト</title> <style type="text/css" media="screen"> html { box-sizing: border-box; font-size: 16px; line-height: 1.5;
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く