-
You still have this line in your page:
Code:
<img src="Left.png" style="position:fixed; top:0; left:0; z-index:10;" alt="!" />
That line came from the test page I created and you don't have the image "Left.png" on your server, so should be removed.
According to the w3.org validator there are 135 errors in your page. Any one of these could be the cause of your problem, so you still have a lot of work to do.
-
The line is present?
Code:
<img src="http://constructionbannerexchange.com/kwr2/wp-content/uploads/2015/09/bg-right1.png" style="position:fixed; top:0; right:0; z-index:10;" alt="!" />
<img src="http://constructionbannerexchange.com/kwr2/wp-content/uploads/2015/09/bg-left.png"style="position:fixed; top:0; left:0; z-index:10;" alt="!" />
And the player only works when I remove the code. There must be a close tag or something I am missing here?
As for w3.org I worry about those errors after I am done with the site with a plugun I add later.
-
Try to think about this logically. You're putting 2 rather large images over the top of your website - images that with their dimensions combined, create a 700 X 650px mask. They may be transparent, but their physical presence is still overlaying everything else. What effect do you think that is having on the interactive elements underneath?
Now, it may be that "pointer-events" will give you a workaround (please Google for the specs) but only in supported browsers.
As for the errors, it would be wise to tackle them sooner rather than later. Fixing them early will stop their (sometimes) compound effect, eliminating knock-on problems before they begin creating other functionality and usability problems in your design.
-
ok,
So if no one knows a html / php or css fix, I guess I will have to do with it.
-
It's not so much whether *we* know the answers, rather how *you* understand and act upon the advice you've been given.
If you want somebody to do all the thinking, problem solving, and coding on your behalf, maybe you could consider hiring somebody?
-
I don't have an issue paying someone, if someone here can be hired? I am at a beginners level and not really understanding a lot of the advice here.
-
OK, here's a compromise. I have split the overlay image into three parts on each side to reduce the masking effect. Look at lines 12 to 17 in this modified test page to see the code. The dotted red lines on the page show the extent of the masking and should be removed from the inline styling. You can also download the six images from that page.
-
Umm, Now this works! I currently have them linked to your site for the moment.
Not sure what you mean by:
The dotted red lines on the page show the extent of the masking and should be removed from the inline styling.
I ee the red lines, not sure what you mean to have them removed.
Thank you!
-
I changed dotted red
to
dotted transparent
-
There's no need to make them transparent. Just remove the "border-left:..../border-right:...." styling from each image.
That temporary file won't be there for very long so you should download the six images and upload them to your own site.