javascript - How can I get jQuery.css() to trump a stylesheet? -
i have been working on page , programmatically set css properties on cover slideshow according how screen real estate there is. if page less 1 boundary number, don't want activate slideshow. if page has width greater boundary number, less threshold, want have slideshow shrink, , shrink more smaller sizes. finally, if greater both, horizontally center slideshow in logical container.
the source @ http://jonathanscorner.com/blacksmiths-forge/experimental.html has:
<iframe id="slideshow" border="0" frameborder="0" frameborder="no" style="display: none;" width="318" height="424" src="/book_covers.cgi?width=318" />
the css @ http://jonathanscorner.com/css/combined.css has:
#slideshow { height: 424px; position: fixed; top: 240px; right: 190px; width: 318px; }
and javascript, @ http://jonathanscorner.com/js/combined.js:
if (jquery(window).width() > 1200) { if (jquery(window).width() > 1300) { var width = min(jquery(window).width() - 1200, 318); document.getelementbyid('slideshow').src = "/book_covers.cgi?width=" + width; document.getelementbyid('slideshow').width = width + 'px'; document.getelementbyid('slideshow').width = width; jquery('#slideshow').css('right', jquery(window).width() - 1200 - 318); jquery('#slideshow').css('display', 'block'); } }
the mental model walked in jquery.css() trump card, , in permutations i've tried far, i've never been aware change has been made jquery.css.
i tried using e.g. jquery('#slideshow').css('display', 'block !important')
.
is there way use jquery (or javascript alone) set properties in way stick?
(what wrong initial understanding, , truth can , can't done programmatic setting of dom node styles , properties?)
you haven't closed iframe tag, combined.js never loaded. iframe's aren't self-closing tags, require opening , closing tag.
<iframe></iframe>
Comments
Post a Comment