close ad
Databridge V2 with MySQLi support IS Now Available!
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Simple HTML button not working in Edge browser only?

Thread began 10/28/2021 5:31 am by Nathon Jones Web Design | Last modified 11/12/2021 1:41 pm by Ray Borduin | 225 views | 14 replies |

Nathon Jones Web Design

Simple HTML button not working in Edge browser only?

I know this is unrelated to WebAssist, but could anyone help me work out why the green 'Book' button doesn't work on the following page in Edge browser? It works in all other browser and platforms and is driving me to distraction now.

https://www.thevaultartscentre.co.uk/event_info.php?eID=131

Thank you.
NJ

Sign in to reply to this post

Ray BorduinWebAssist

I can't explain it... it must be a script on the page that is somehow breaking the button. There is nothing wrong with the html.

Sign in to reply to this post
Did this help? Tips are appreciated...

Nathon Jones Web Design

I don't understand coding any more. It's a button...it works on every other browser, on any device, but not in Microsoft Edge. Close to throwing the towel in (was close years ago).

Sign in to reply to this post

Ray BorduinWebAssist

If you send me FTP information then I can debug it for you.

I'd start by removing the scripts from the page one at a time and see if the button works then. I'm thinking it will. Then I'd try to isolate the exact script and line that is causing the issue.

It isn't really a button.. it is an image with a link around it. It should work. That is why I'm thinking one of the other scripts is disabling it.

Sign in to reply to this post
Did this help? Tips are appreciated...

Nathon Jones Web Design

It's affecting all of my sites and I've never been able to work it out. I understand the logic in diagnosing what's wrong, but how does that explain it working in every other browser? When will all these companies just grow up and talk to each other to make it easier for developers? It's infuriating.
FTP details below. Thank you Ray.
NJ

Sign in to reply to this post

Ray BorduinWebAssist

The issue has something to do with the use of the bxslider jquery slider.

It appears you had your button in a slider element, even though it isn't actually a slider on the page.

The slider overrides the touch element to allow drag to switch slider elements on phones and that was breaking the link. I'm not sure why edge treats it differently than other browsers.

I fixed the issue by changing the div class so it isn't "slider" so that the slider isn't initiated for that element. That seems to have fixed the issue.

Sign in to reply to this post
Did this help? Tips are appreciated...

Nathon Jones Web Design

Hi Ray. Whatever you've done has broken the CSS/JS on our header section. Previously, when you scroll down, an event was triggered that placed a white background in the top section (the logo and buttons) and changed the logo from white to black.

Did you just change something on event_info.php, or something sitewide?

In a way, I'm glad to see that it's not just me that experiences these types of issues, but in another way my utter frustration with how buggy all of this still is, in late 2021 (unless TV has lied to me, I'm pretty sure we were all meant to have hover cars by now), just increases.

Why Edge treats this differently to ALL other browsers is probably the same reason why the world is in such a bad way. Sheer-bloody-mindedness and an unwillingness to work together for a common good. <sigh>

Hamster-wheel syndrome feeling here. Worn out by it.

Appreciate your help, as ever. If you can let me know what you changed, I'll try and get my menu back.
I may need to switch the whole thing to Bootstrap Carousel, but my understanding is that, too, isn't cross-browser compatible.

Any recommendations on a reliable, compatible, slider script?

Thank you.
NJ

Sign in to reply to this post

Ray BorduinWebAssist

The only css file I was messing with is the /css/styles.css file. But I don't think I did anything that would have changed that area. I only changed css related to the button that wasn't working.

Sign in to reply to this post
Did this help? Tips are appreciated...

Nathon Jones Web Design

What did you change in /css/styles.css

I had a .navbar-scrolled thing happening in that stylesheet that changed the navbar from having a transparent background to a #fff filled background on scroll, in exactly the same way as I have on this site:
https://moteviewholidaylets.co.uk/index.php

However, that is no longer working on this site:
https://www.thevaultartscentre.co.uk/index.php

....and I haven't made any changes.

Weirder still, I hadn't realised it was styles.css you had changed so I have overwritten that now with the stylesheet that the scrolled functionality worked with previously.

NJ

Sign in to reply to this post

Ray BorduinWebAssist

The code that does the background color on scroll is in creative.js... It looks like you just don't have that .js file on your page.

I added it to the page I was working on and that fixes it for that page, but I wasn't the one that removed it. I'm not sure where you had it so it would be on all pages. Maybe you want to add it to a template or include file.

Sign in to reply to this post
Did this help? Tips are appreciated...
loading

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...