Title: Responsive script won't work in WordPress? Last modified: August 21, 2016 --- # Responsive script won't work in WordPress? * Resolved [Ninjamankid](https://wordpress.org/support/users/ninjamankid/) * (@ninjamankid) * [13 years, 1 month ago](https://wordpress.org/support/topic/responsive-script-wont-work-in-wordpress/) * Hi, * I have been following Adobe Product Manager Sarah Justine’s tutorial ([http://sarahjustine.com](http://sarahjustine.com)) on how to make an animation responsive. She has created a script that seems to work perfectly when you resize your browser or use a handheld device. Script is inserted into the “Stage” component: * (choose compositionReady in dropdown and add code below) * var stageHeight = sym.$(‘Stage’).height(); // Set a variable for the height of the stage * sym.$(“#Stage”).css({ // Set the transform origin so we always scale to the top left corner of the stage “transform-origin”:”0 0″, “-ms-transform-origin”:”0 0″, “-webkit-transform-origin”:”0 0″, “-moz-transform-origin”:”0 0″, “-o-transform- origin”:”0 0″ }); * function scaleStage() { var stage = sym.$(‘Stage’); // Set a reusable variable to reference the stage var parent = sym.$(‘Stage’).parent(); // Set a reusable variable to reference the parent container of the stage * var parentWidth = stage.parent().width(); // Get the parent of the stage width var stageWidth = stage.width(); // Get the stage width var desiredWidth = Math. round(parentWidth * 1); // Set the new width of the stage as it scales var rescale = (desiredWidth / stageWidth); // Set a variable to calculate the new width of the stage as it scales * // Rescale the stage! stage.css(‘transform’, ‘scale(‘ + rescale + ‘)’); stage. css( ‘-o-transform’, ‘scale(‘ + rescale + ‘)’); stage.css(‘-ms-transform’, ‘scale(‘ + rescale + ‘)’); stage.css(‘-webkit-transform’, ‘scale(‘ + rescale + ‘)’); stage. css(‘-moz-transform’, ‘scale(‘ + rescale + ‘)’); stage.css(‘-o-transform’, ‘scale(‘ + rescale + ‘)’); parent.height(stageHeight * rescale); // Reset the height of the parent container so the objects below it will reflow as the height adjusts} * // Make it happen when the browser resizes $(window).on(‘resize’, function(){ scaleStage(); }); * // Make it happen when the page first loads $(document).ready(function(){ scaleStage();}); * My problem is: * • Works perfectly when previewed from inside Edge Animate – whole animation scales as it should. • Does not work at all inside WP – no scaling takes place. * I’m not a coder so I have no idea what might be happening. Maybe the plug-in flushes the script (unlikely). Maybe the script is written to work on an ordinary html page and not a dynamic one, like WP? Any help would be greatly appreciated since this script seems very useful! * I have posted this on the Adobe Edge Animate forum as well. * Regards * Johan * [http://wordpress.org/extend/plugins/edge-suite/](http://wordpress.org/extend/plugins/edge-suite/) Viewing 5 replies - 1 through 5 (of 5 total) * Plugin Author [ti2m](https://wordpress.org/support/users/ti2m/) * (@ti2m) * [13 years, 1 month ago](https://wordpress.org/support/topic/responsive-script-wont-work-in-wordpress/#post-3644681) * Can you sent me your OAM to [edge@timm-jansen.de](https://wordpress.org/support/topic/responsive-script-wont-work-in-wordpress/edge@timm-jansen.de?output_format=md), then I’ll check what’s happening. * Plugin Author [ti2m](https://wordpress.org/support/users/ti2m/) * (@ti2m) * [13 years, 1 month ago](https://wordpress.org/support/topic/responsive-script-wont-work-in-wordpress/#post-3644682) * The fix is actually quiet simple, just remove the # in front of ‘#Stage’ within ` sym.$("#Stage").css` so it says `sym.$("Stage").css`. That should fix the whole thing and it should also work with shortcodes. Let me know if that solves it for you. * Thread Starter [Ninjamankid](https://wordpress.org/support/users/ninjamankid/) * (@ninjamankid) * [13 years, 1 month ago](https://wordpress.org/support/topic/responsive-script-wont-work-in-wordpress/#post-3644685) * HI, * I still can’t get the animation to show up. I removed the # but problem persists. Could it have something to do with the theme I am using? Maybe the .oam doesn’t find the JQuery files? I’ll mail my latest .oam. * Johan * Plugin Author [ti2m](https://wordpress.org/support/users/ti2m/) * (@ti2m) * [13 years, 1 month ago](https://wordpress.org/support/topic/responsive-script-wont-work-in-wordpress/#post-3644707) * Don’t think it’s the theme, which one are you using? Just sent me your current version per mail and I’ll check it. * Thread Starter [Ninjamankid](https://wordpress.org/support/users/ninjamankid/) * (@ninjamankid) * [13 years, 1 month ago](https://wordpress.org/support/topic/responsive-script-wont-work-in-wordpress/#post-3644717) * Actually it now works if you follow the tip above: * **The fix is actually quiet simple, just remove the # in front of ‘#Stage’ within sym.$(“#Stage”).css so it says sym.$(“Stage”).css. That should fix the whole thing and it should also work with shortcodes. * Don’t know why it didn’t work before, I probably screwed something up somewhere. Viewing 5 replies - 1 through 5 (of 5 total) The topic ‘Responsive script won't work in WordPress?’ is closed to new replies. * ![](https://s.w.org/plugins/geopattern-icon/edge-suite.svg) * [Edge Suite](https://wordpress.org/plugins/edge-suite/) * [Frequently Asked Questions](https://wordpress.org/plugins/edge-suite/#faq) * [Support Threads](https://wordpress.org/support/plugin/edge-suite/) * [Active Topics](https://wordpress.org/support/plugin/edge-suite/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/edge-suite/unresolved/) * [Reviews](https://wordpress.org/support/plugin/edge-suite/reviews/) * 5 replies * 2 participants * Last reply from: [Ninjamankid](https://wordpress.org/support/users/ninjamankid/) * Last activity: [13 years, 1 month ago](https://wordpress.org/support/topic/responsive-script-wont-work-in-wordpress/#post-3644717) * Status: resolved