Avatar of Bruce Gust
Bruce Gust
Flag for United States of America asked on

Why does this page freez up?

Head out to http://brucegust.com/kitchen/stunt_double.php

I've got a code in place that makes the main browser turn grey while simultaneously revealing a pop up window.

It works great when there's only one product, but I ran into a snag when I attempted to loop through a number of products...

the screen sticks to the top the user's monitor
after you close it, the whole  screen freezes

Obviously, I'm missing something. What do you think? Why does my pop up window not play nicely with everything else?
JavaScript

Avatar of undefined
Last Comment
Bruce Gust

8/22/2022 - Mon
zephyr_hex (Megan)

Does the problem not happen when you comment out the pop up?  If so, can you please post the code for the pop up and the code for how it's triggered.
Bruce Gust

ASKER
Hey, Zephyr!

First off, "Yes!" If I remove the hidden div and the corresponding Javascript that goes along with revealing the code, then the page can be navigated (moved up and down) without any problem.

As I was reviewing the code in order to answer your first question, I had an epiphany. And while I think my logic is sound, I don't know how to fix it.

I have multiple buttons, all of which have an id of "button." As I mentioned earlier, when there's only one product on the page, the code works great. But when I have multiple "buttons," it's then when my page fails.

Is that a problem? It seems like and "id," by default, needs to reference a unique entity. If that's the cast, then that would explain why my page is failing.

How can I loop through things so that my id's don't overlap and I can accomplish the same functionality?
SOLUTION
zephyr_hex (Megan)

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
GET A PERSONALIZED SOLUTION
Ask your own question & get feedback from real experts
Find out why thousands trust the EE community with their toughest problems.
SOLUTION
lenamtl

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
⚡ FREE TRIAL OFFER
Try out a week of full access for free.
Find out why thousands trust the EE community with their toughest problems.
ASKER CERTIFIED SOLUTION
Member_2_248744

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
⚡ FREE TRIAL OFFER
Try out a week of full access for free.
Find out why thousands trust the EE community with their toughest problems.
SOLUTION
Member_2_248744

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
⚡ FREE TRIAL OFFER
Try out a week of full access for free.
Find out why thousands trust the EE community with their toughest problems.
Bruce Gust

ASKER
Gentlemen!

I tool your collective counsel and crafted a JQuery function that does the trick, however...

While my page doesn't freeze and the use of "classes" rather than "id's" is no longer happening, my pop up isn't centered and the greyed out effect doesn't extend to the bottom of the page.

Wondering if y'all might help me with that.

Thanks!

https://www.experts-exchange.com/questions/28930351/How-can-I-get-this-grey-screen-to-extend-all-the-way-down-to-the-bottom-of-my-page.html
I started with Experts Exchange in 2004 and it's been a mainstay of my professional computing life since. It helped me launch a career as a programmer / Oracle data analyst
William Peck