Having issues with IE8 and SmoothGallery script errors

I'm currently utilizing the SmoothGallery plugin created by Jon Designs to enhance the website of one of my clients. However, there seems to be a minor issue in Internet Explorer 8 when attempting to navigate to the next image. Interestingly enough, after conducting tests on various browsers, it appears that IE is the only one where this problem occurs.

Isn't that just typical?

I've been diligently investigating the root cause of this predicament, but unfortunately, I only receive an error within the eval-function of the mootools library which forms the foundation of this gallery. As a result, I haven't had much luck pinpointing the exact source of the issue.

Is there any possibility of setting up an "All-Exceptions Breakpoint," similar to what can be done in Xcode? This would allow me to identify the specific line of code where the hang-up occurs. Alternatively, does anyone have insights into what might be happening here?

The corresponding site can be accessed via , and the responsible JS file for the gallery can be found at

I sincerely appreciate any assistance provided.

Tobias Timpe

Answer №1

You have an extremely outdated version of mootools - 0.89 or 1.0, if I remember correctly. It's packed with evals using dean edwards' PACKER, which makes it very difficult to debug.

The code for instantiating is quite messy and monkey patched:

function startGallery17() {
    if (window.gallery17) {
        try {
            var myGallery17 = new gallery($('myGallery17'), {
                timed: false,
                showArrows: true,
                showCarousel: false,
                textShowCarousel: 'Thumbnails',
                embedLinks: false,

                lightbox: true
            });
            var mylightbox = new LightboxSmoothgallery();
        } catch (error) {
            window.setTimeout("startGallery17();", 2500);
        }
    } else {
        window.gallery17 = true;
        if (this.ie) {
            window.setTimeout("startGallery17();", 3000);
        } else {
            window.setTimeout("startGallery17();", 100);
        }
    }
}
window.onDomReady(startGallery17);

The use of strings in setTimeouts also causes evals here, and the try blocks will prevent you from getting any useful error feedback.

If you want to solve this issue, remove these hacks and load a newer but still old version of mootools like this one: https://ajax.googleapis.com/ajax/libs/mootools/1.11/mootools.js, or preferably, try version 1.12 and see if debugging becomes easier.

After that, remove the try/catch blocks and use window.addEvent('domready', fn) to start your code - or if you depend on images being loaded, consider using window.addEvent('load', fn) instead.

If all you're doing on the page is stacking up some images with a next/previous functionality, why not use the latest mootools with a new plugin - there is absolutely nothing beneficial about what you've chosen.

For example, take a look at this tutorial I wrote on how to do it: , or search on the forge for something packaged: .

You should be fine with version 1.4.5 (the latest one).

Keep in mind that the version you're currently using will likely break in IE9 and the latest Gecko-based browsers.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Sending information to a Flask application using AJAX

Currently, I am working on transferring URLs from an extension to a Flask app. The extension is able to access the current URL of the website. I have set up an AJAX request to connect to Flask, and the connection is successful. However, when trying to send ...

How can an AngularJS/Ionic mobile application incorporate an external JavaScript script?

Can external JavaScript scripts be executed in an AngularJS/Ionic mobile app, particularly on non-jailbroken iOS devices? We are considering creating a launcher version of our app that downloads the required scripts and then installs and runs them. I have ...

Is there a way to retrieve a promise from a function that triggers a $http.get request in AngularJS?

Looking for a solution to modify this function: getX: function ($scope) { $http.get('/api/X/GetSelect') .success(function (data) { ... ... }) .error(function (data) { ...

Tips for using ng-repeat in AngularJs to filter (key, value) pairs

I am trying to achieve the following: <div ng-controller="TestCtrl"> <div ng-repeat="(k,v) in items | filter:hasSecurityId"> {{k}} {{v.pos}} </div> </div> Code snippet for AngularJs: function TestCtrl($scope) { ...

What is the best approach for determining the most effective method for invoking a handler function in React?

As a newcomer to React, I am navigating through the various ways to define callback functions. // Approach 1 private handleInputChange = (event) => { this.setState({name: event.target.value}); } // Approach 2 private handleInputChange(event){ t ...

What methods can be used to customize the font and background color of a website for different user groups?

Trying to incorporate a template into my project. My client has requested the following: The regular user area should feature a blue background. The professional user area should have an orange background. Is there a way to set up a condition to change ...

Bringing in a script and invoking a function on a specific variable

As a newcomer to Typescript, I've been experimenting with some code I came across online to enhance the appearance of links on my website. <script src="https://wow.zamimg.com/widgets/power.js"></script> <script>var wowhead_tooltips ...

Combine the values in the rows over a period of time

I have a set of three times in the format of Minute:Seconds:Milliseconds that I need to add together to get the total time. For example, let's say I have: 0:31.110 + 0:50.490 + 0:32.797, which equals 1:54.397. So how can I achieve this using JavaScr ...

Issue with sync-request when using post data doesn't seem to be functioning

I am currently working on a Node.js application where I need to make synchronous requests. After some research, I came across the sync-request npm package for making these requests. However, when I tried using the code below, I encountered an error with th ...

What measures can be taken to safeguard this hyperlink?

Is there a way to conceal HTML code from the source code? For instance: jwplayer("mediaplayer").setup({ file: "http://example.com/Media.m3u8", autostart: 'true', controlbar: 'bottom', file: "http://exa ...

Tips for creating CSS styles for a selected input field

I seem to be stuck in a situation where my screen looks similar to the screenshot provided. There are four input elements that I would like to have bordered just like in the image, complete with a circled tick mark. I've managed to create these four i ...

The Hover Hover textbox stays in place once clicked on

I have implemented a search bar that displays a textbox when a user hovers over a button. I am looking to modify the code so that the textbox remains visible even after the user has clicked on it. This way, if the user accidentally moves their mouse away f ...

Customize Monaco Editor: Implementing Read-Only Sections

I am currently working on setting up the Monaco Editor so that specific sections of the text content are read-only. Specifically, I want the first and last lines to be read-only. See example below: public something(someArgument) { // This line is read-onl ...

Module-alias cannot be resolved by esm

Currently, I am utilizing the combination of esm package and module-alias. However, it appears that esm is not recognizing module-alias's paths. This is how I am loading my server file: nodemon -r esm ./src/index.js 8081 At the beginning of my inde ...

Leverage variable as an expression when utilizing ng-include

Here is an example of working code: <div ng-include src="'Test.html'"></div> However, this code does not work: <div ng-include src="ctrl.URL"></div> (When ctrl.URL is set to "Test.html"). I have also tried setting it t ...

Steps for inserting a new entry at the start of a dictionary

My fetch method retrieves recordings from the database, but I need to prepend a new record to the existing data for frontend purposes. Can someone assist me with this? <script> export default { components: { }, data: function() { ...

When using jquery.hide() and show(), the content within the div disappears momentarily before reappearing

Hello! I am experiencing an issue where the content of my div disappears after using a jQuery hide() and show() function. It seems to be gone. <li class="gg3"><a class="link" href="#" data-rel="content3">Link1</a></li> <div clas ...

What is the method for identifying the environment within an Express.js application?

Is there a reliable method for determining the environment in which an expressJS app is currently operating (development, test, production)? I have checked process.env, but found no clear indication of the environment. I know that variables can be set in ...

The Javascript function is being called, yet it cannot be defined

I am currently in the process of revamping an older website that was originally designed for compatibility with IE8 and utilizes framesets for layout management. As part of this update, I am trying to implement a piece of code within one frame that will g ...

Display the same data point on a Google Map from two different rows of a database

I'm looking to display multiple values for profFName and profLName on a map with just one point showing this information. If I have (2) pID connected to the same marker, I want it to show both profFName and profLName on a single point. Currently, it ...