Solving technology problems, one at a time
I had a lot of trouble getting TinyMCE text editor to work consistently in Drupal 5.9, so when I installed Drupal 6 and was scanning through the available modules, I was very glad to see that the WYSIWYG editor module could function as a replacement.
Although the easy-to-use WYSIWYG editor is popular with our site’s users, sometimes I find it gets in the way, and want to turn it off.
A customer’s course was crashing Internet Explorer when a popup window script executed. It turns out that the name of the new window contained a space. This didn’t bother Safari or Firefox, but Internet Explorer
Continue readingWe found that some of our users did not know how to maximize windows (or even that it was possible!), and so never saw the navigation bar and buttons on the bottom of a Captivate-based course they had to take.
The customer who designed the course asked that we add instructions on maximizing the window, but I thought that it would make more sense just to make the window maximize itself.
It’s been a while since I used window sizing functions, so I went hunting for a script that works across all browsers.
After trying several, I found that some “auto-maximize window” scripts don’t even work every time on ANY browser. The one that worked best on every browser I tested it on is available free from Dynamic Drive, here.
Continue readingSometimes, when you use javascript to make a change to some element on a page, you will get a Javascript error along the lines of: “element ‘n’ has no properties.” You check your page, and yes, the element is definitely there, and it is definitely named correctly, and your syntax is definitely correct. So where is the problem?
Well, it may be a timing issue. If your script executes before the element targeted by the script has been rendered, it will not find the element. This can particularly be a problem with frames or iframes. The solution is to move the function call to the bottom of the page, after the element has loaded.
Continue readingIt is common to use object detection to discriminate between browser capabilities (See Quirksmode: Object Detection.
However, sometimes it is necessary to detect whether or not a browser understands a particular CSS style property, and it is not obvious how to do this.
You can’t test for the existence of the property directly but you can test for the data type of the value of the property. If the data type is anything but “undefined”, the property is understood by the browser.
The example below shows a couple of rows from an automatically generated table of items. Each row has a corresponding editable version which shows up when the “edit” button is clicked. The original, non-editable row is hidden at the same time the editable row is displayed. If “display=’block” is used to display the TR, Safari will render it as a TD. To correct this, “display=’table-row” must be used on browsers that understand it.
Continue readingHave you ever tried to use a javascript to modify the properties of a frame? Particularly a javascript ON the frameset page? If you have tried, you probably know that timing plays an important role.
Continue readingSuppose you want to use the value of one variable as part of the name of another variable, but you don’t know the exact name of the first variable, because it will be selected by user input.
Continue readingHave you ever wanted to assign a function to an onload or onclick event, based on some condition or even from another page? A project where this came in handy was a multi-page learning module.
Continue readingSeveral branching functions are included in js/branchingToolkit.js and are available to be used in your modules. Note: These haven’t been thoroughly tested!
The css styles are defined in several sheets. Any of the styles can be overridden by adding a new definition for the selector to /css-local/userStyles.js or to individual pages or even individual elements on a page. YOU WILL NOT BE ABLE TO change any of the files inside the css/ folder but you can add your own overrides to userStyles.css.
Continue reading