• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Tim Cooke
  • Devaka Cooray
  • Ron McLeod
  • Jeanne Boyarsky
Sheriffs:
  • Liutauras Vilda
  • paul wheaton
  • Junilu Lacar
Saloon Keepers:
  • Tim Moores
  • Stephan van Hulst
  • Piet Souris
  • Carey Brown
  • Tim Holloway
Bartenders:
  • Martijn Verburg
  • Frits Walraven
  • Himai Minh

Dynamic close button only shows in Firefox

 
Greenhorn
Posts: 4
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
HI, I am working on a website and have managed to create a page that will play a youtube movie depending on which area of an image is clicked on. Everything seems to work fine, the movies open and play fine but the only problem is that the close button doesn't show in anything other than Firefox. I have tried adding an image as the close button's background but nope, makes no difference, it just isn't there. I've tried both internet explorer and chrome

I have spent several hours on this and it's driving me nuts, any help would be very gratefully recieved

here is the javascript

//Create dynamic Close Button Div
var closebutton = document.createElement('div');
closebutton.style.visibility = "visible";
closebutton.innerHTML = "<span onclick=\"closeYouTube('" + id +"')\" class=\"close_button\">X</span>";
//Add Close Button Div to YouTube Popup Div container
divobj.appendChild(closebutton);

here is the css

.close_button {
font-family: Verdana, Geneva, sans-serif;
font-size: small; font-weight: bold;
color: #666; text-decoration: none;
display: block; float: right;
background-color: #FFF;
z-index: 5500; cursor: default;
border: 2px solid #000;
margin-bottom: -2px;
padding: 0px 3px 0px 3px;
position:absolute;
top:1px;
right:2px;
background-image:url(images/coss.jpg);
}
 
author
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
This seems to work fine for me. What is different? Can you give a better example? Errors?



 
Tracey Couchman
Greenhorn
Posts: 4
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Hi, thanks for your response.

I've managed to get it working, sort of...

Using the code I had the close button appears fine in Firefox but with any other browser it wasn't there. Eventually I moved the close button to outside the main window so that instead of sitting in the top righthand corner it was sitting on top of the top righthand corner, then it could be seen in all the browsers I have tried it in.

I don't know if it is a CSS thing although the only CSS attribute I thought could affect it like that would be z-index and I've made it a silly z-index number that would definately be on top
 
A teeny tiny vulgar attempt to get you to buy our stuff
the value of filler advertising in 2021
https://coderanch.com/t/730886/filler-advertising
reply
    Bookmark Topic Watch Topic
  • New Topic