View Full Version : How to add custom close button option to invoke script?

02-20-2012, 10:56 PM
1) Drop-in content box v2.0:

2) http://www.dynamicdrive.com/dynamicindex17/dropinbox.htm:

I see the line in dropincontentbox.js to change the close image but how can I add that line to the invoke script within the HTML file just as the other options such as freq, showduration?

This is what I tried without success

var dropinbox1=new dropincontentbox({
cssclass:'dropinbox standardshadow',
closebutton:'<div class="closer"><img src="star.png" /></div>'



02-21-2012, 03:23 PM
I suspect the option has to be defined in dropincontentbox.js which I tried in line

this.s=jQuery.extend({fx:'easeOutBounce', fxtime:500, freq:'always', showduration:0, pos:['center','center'], deferred:0.5, closebutton:'star.png'}, options)
I still got no results. Can someone please advise how to get this done?

The key reason for this is that I use multiple instances of the script and each has a different styling but all have the same close button and it spoils the appearance.

02-25-2012, 02:10 AM
Still searching for a solution.

02-26-2012, 02:02 AM
I spent some hours at the jquery website and still cannot figure a solution

02-28-2012, 07:43 PM
Still no solution to get this done but still trying

03-01-2012, 08:31 AM
Went to stack overflow with the question and holding out for a reply there too. Will post solution if rendered.

03-01-2012, 07:22 PM
Look through the supporting files and find the default image being used for the 'close' button and replace it. It may just use a css background image.

03-02-2012, 08:12 AM
The image is a literal source but I'll try using css

03-05-2012, 11:30 PM
The image I have been able to control with css as suggested by lonewolf.
I replaced the image with and empty container
this.closebutton='<div class="closer"></div>'

and included the class in the invoke script
cssclass:'dropinbox standardshadow closer',

Then changed as needed in the .css file.

But now I want to use an option in the invoke script to show or hide the close button. The default hides it and then it displays when the object is hovered. Something like

closebuttonhide: false

Can someone advise how to do this?