On 12 October 2011 03:51, Bill Mudry <billmudry@xxxxxxxxxx> wrote: > I have been doing fairly well with authoring a cybermall that will be for > the purpose of inviting successful exotic wood companies to each have their > own store in my mall to sell a wide variety of exotic woods. I will include > the URL to the home page that I am working on ---- but please > understand this is NOT at all any attempt to do so to promote anything. > Instead, it is far easier to understand my objectives in making part of the > page have a background slide show since it is all very graphic: > http://www.exoticwoodmall.com/index2.php > > Note the reddish wood pattern background behind the cream coloured section > in front that has a title of "Exotic Wood Mall". It occurred to me > that it might be possible to have not a usual slide show but one that runs > in the background instead. I searched around the Net and found an > appropriate Javascript. Using different wood scans, I made a separate page > just to prove they could run in circulating manner (ie. slideshow) > and was successful; > http://www.exoticwoodmall.com/index2.php > > This simple page loads the images into memory and rotates the active picture > after each set time-out. It is started by this tag: > > <body onload="runBGSlideShow()"> > > Ie. it takes a body tag to get it going. This may be a common way of > starting such scripts but it will not > work on the home page where I want it (see above). I would rather have this > background slide action > happening only in the background area that is red. It is defined by a div > statement. I tried attaching the onload statement to the div with no > success. That area, also, is part of an include file, so there is no <body > .... statement on which to hang the onload blah blah in traditional manner. > > I looked around on the Net to see more what "onload" will work with. The > closest I came to was perhaps some > comments on using "readystate" which I am totally unfamiliar with. It is > well beyond any knowledge I have had for using Javascript. > > So... Is there any solution or solutions to making this work that any of you > know? If we can get it to work,it could make for some really neat theme > making eye candy for many websites, my Exotic Wood Mall > included :-) :-). It does not have to be Javascript even if something else > works better. > > .... I can include code from the page if really needed but it would be > better to attack the solution in a > more general way of how to start the script outright. > > .... for all those Canadians out there, a slightly belated Thanksgiving! > > Much thanks for all efforts, > > Bill Mudry > > The <body onLoad=""> syntax is only to get the code running. I use Prototype (JQuery will have a similar mechanism). One of the ways in which to use Prototype is to ask it to watch for a very specific event. The event is the 'dom:loaded' event. You can see the documentation at http://api.prototypejs.org/dom/document/observe/ So, something like ... <head> <title>...</title> <!-- Links to CSS next. If you can consolidate all CSS for a single server into a single file dynamically, faster loading and caching --> <!-- Script tags last. Repeat the single file JS loading. --> <!-- Load Prototype from the Google APIs cache --> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js";></script> <script type="text/javascript" src="http://www.exoticwoodmall.com/slideshow.js";></script><!-- or whatever URL you have for your slideshow code --> <script type="text/javascript"> document.observe('dom:loaded', 'runBGSlideShow'); </script> </head> would be the same sort of thing. If your slide show uses Prototype then it should start running just as happily. If it uses JQuery, then choose the appropriate url from http://code.google.com/apis/libraries/devguide.html for JQuery and the UI (if used). So, this will load the slideshow in a relatively standard way - it is long been suggested that using HTML tag attributes to load JS code is bad form. Others say that the code that makes things all go should be loaded at the bottom of the HTML content ... <script type="text/javascript"> runBGSlideShow(); </script> </body> </html> Again, you have additional content in the HTML. I prefer the document.observe() approach. Other opinions are available, I'm sure. For server side CSS and JS combining, take a look at http://www.sonassi.com/knowledge-base/combine-and-compile-css-and-js-into-gzipped-files/ I've used a modified version of the initial work carried out by Rakaz (http://rakaz.nl/projects/combine/combine.phps) for many years. This new work on www.sonassi.com looks interesting. Richard. P.S. Initially I was going to send this offlist as this would seem to be a JS issue only, but thanks to the JS and CSS combinator being PHP code, I successfully pulled it back on list. But in truth, only just. -- Richard Quadling Twitter : EE : Zend : PHPDoc @RQuadling : e-e.com/M_248814.html : bit.ly/9O8vFY : bit.ly/lFnVea -- PHP Windows Mailing List (http://www.php.net/) To unsubscribe, visit: http://www.php.net/unsub.php
