X
Tap here to go to the mobile version of the site.

Support Forum

When I open a page with svg content in Firefox, the svg only seems to work in the top part of the screen.

Posted

There is an animated rectangle in my test html page. The rectangle disappears gradually as it gets about a quarter of the way down the screen. I don't have this problem running the same page in Chrome. The code is:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8" />
  <title>SVG</title>
 </head>
 <body bgColor="red">

<script>

var SVG=function(h,w){
 var NS="http://www.w3.org/2000/svg";
 var svg=document.createElementNS(NS,"svg");
           
 //alert(h);
 //svg.width=w;
 //d7,=============================,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,svg.height=h;
 
 return svg;
}
var svg=SVG(1800,1800);
document.body.appendChild(svg); 
alert (svg.height);
var rect=function(h,w,fill){
 var NS="http://www.w3.org/2000/svg";
 var SVGObj= document.createElementNS(NS,"rect");
 SVGObj.width.baseVal.value=w;
 SVGObj.height.baseVal.value=h;
 SVGObj.setAttribute("height",h);
 SVGObj.style.fill=fill;
 return SVGObj;
}

var r= rect(100,200,"blue");
svg.appendChild(r);

r.x.baseVal.value=10;
r.y.baseVal.value=20;

var animate=function(obj){
 obj.x.baseVal.value+=1;
 obj.y.baseVal.value+=1;
}

setInterval("animate(r)",100);
 </script>
</body>
</html>

Thanks

There is an animated rectangle in my test html page. The rectangle disappears gradually as it gets about a quarter of the way down the screen. I don't have this problem running the same page in Chrome. The code is: <pre><nowiki><!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>SVG</title> </head> <body bgColor="red"> <script> var SVG=function(h,w){ var NS="http://www.w3.org/2000/svg"; var svg=document.createElementNS(NS,"svg"); //alert(h); //svg.width=w; //d7,=============================,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,svg.height=h; return svg; } var svg=SVG(1800,1800); document.body.appendChild(svg); alert (svg.height); var rect=function(h,w,fill){ var NS="http://www.w3.org/2000/svg"; var SVGObj= document.createElementNS(NS,"rect"); SVGObj.width.baseVal.value=w; SVGObj.height.baseVal.value=h; SVGObj.setAttribute("height",h); SVGObj.style.fill=fill; return SVGObj; } var r= rect(100,200,"blue"); svg.appendChild(r); r.x.baseVal.value=10; r.y.baseVal.value=20; var animate=function(obj){ obj.x.baseVal.value+=1; obj.y.baseVal.value+=1; } setInterval("animate(r)",100); </script> </body> </html></nowiki></pre> Thanks

Modified by cor-el

Additional System Details

Installed Plug-ins

  • Google Update
  • GEPlugin
  • Next Generation Java Plug-in 10.25.2 for Mozilla browsers
  • NPRuntime Script Plug-in Library for Java(TM) Deploy
  • The plugin allows you to have a better experience with Microsoft Lync
  • Shockwave Flash 11.7 r700
  • 5.1.20513.0
  • Adobe PDF Plug-In For Firefox and Netscape 11.0.03
  • iTunes Detector Plug-in
  • Picasa plugin
  • Sony Reader Application Detector Plugin
  • The QuickTime Plugin allows you to view a wide variety of multimedia content in Web pages. For more information, visit the QuickTime Web site.
  • The plugin allows you to have a better experience with Microsoft SharePoint
  • DivX Plus Web Player version 2.2.0.52
  • Progress bar for Image Web Server
  • Tool bar for Image Web Server Images
  • The ECW plugin allows you to view gigabyte size imagery over the internet. Visit http://www.erdas.com for more information.
  • DivX VOD Helper Plug-in
  • ABR_AUSkey Plugin Mozilla Component
  • 1.7
  • NPWLPG
  • CANON iMAGE GATEWAY Album Plugin Utility Module
  • 1.9.0042.0
  • DjVu Plug-In(external version 6.1.1.1574)

Application

  • Firefox 24.0
  • User Agent: Mozilla/5.0 (Windows NT 6.1; rv:24.0) Gecko/20100101 Firefox/24.0
  • Support URL: https://support.mozilla.org/1/firefox/24.0/WINNT/en-GB/

Extensions

  • LastPass 2.0.20 (support@lastpass.com)
  • Troubleshooter 1.1a (troubleshooter@mozilla.org)
  • Ask Shopping Toolbar 20.51064 (toolbar_OVO2V7-SAT@apn.ask.com) (Inactive)
  • DivX Plus Web Player HTML5 <video> 2.1.2.145 ({23fcfd51-4958-4f00-80a3-ae97e717ed8b}) (Inactive)

Javascript

  • incrementalGCEnabled: True

Graphics

  • adapterDescription: ATI Mobility Radeon HD 5165
  • adapterDescription2:
  • adapterDeviceID: 0x9480
  • adapterDeviceID2:
  • adapterDrivers: atiumdag atidxx32 atidxx64 atiumdva atiumd64 atiumd6a atitmm64
  • adapterDrivers2:
  • adapterRAM: 1024
  • adapterRAM2:
  • adapterVendorID: 0x1002
  • adapterVendorID2:
  • direct2DEnabled: False
  • direct2DEnabledMessage: [u'tryNewerDriver', u'10.6']
  • directWriteEnabled: False
  • directWriteVersion: 6.2.9200.16571
  • driverDate: 9-8-2009
  • driverDate2:
  • driverVersion: 8.653.0.0
  • driverVersion2:
  • info: {u'AzureContentBackend': u'none', u'AzureCanvasBackend': u'skia', u'AzureFallbackCanvasBackend': u'cairo'}
  • isGPU2Active: False
  • numAcceleratedWindows: 2
  • numTotalWindows: 2
  • webglRenderer: Google Inc. -- ANGLE (ATI Mobility Radeon HD 5165 Direct3D9Ex vs_3_0 ps_3_0)
  • windowLayerManagerRemote: False
  • windowLayerManagerType: Direct3D 9

Modified Preferences

  • browser.cache.disk.capacity: 358400
  • browser.cache.disk.smart_size.first_run: False
  • browser.cache.disk.smart_size.use_old_max: False
  • browser.cache.disk.smart_size_cached_value: 358400
  • browser.places.smartBookmarksVersion: 4
  • browser.startup.homepage_override.buildID: 20130812173056
  • browser.startup.homepage_override.mstone: 24.0
  • dom.mozApps.used: True
  • extensions.lastAppVersion: 24.0
  • network.cookie.prefsMigrated: True
  • places.database.lastMaintenance: 1376716148
  • places.history.expiration.transient_current_max_pages: 80259
  • plugin.disable_full_page_plugin_for_types: application/pdf
  • plugin.importedState: True
  • privacy.sanitize.migrateFx3Prefs: True
  • storage.vacuum.last.index: 1
  • storage.vacuum.last.places.sqlite: 1376381287

Misc

  • User JS: No
  • Accessibility: Yes
Marc Sances 20 solutions 240 answers

Ask at svg-developers, you'll probably find your answer faster there.

Ask at [http://tech.groups.yahoo.com/group/svg-developers/ svg-developers], you'll probably find your answer faster there.