Jump to content

Advanced PopUp Box Options

almulder
 Share

Recommended Posts

almulder

almulder

Posted
Posted

Open up "useroptions.js"

Find this line:

Style[0]=

Now this is where all the code for the popup box's are, it is as follows.

Style[0]=['var1,'var2','var3’,’var4,'var5','var6','var7','var8','var9','var10','var11','var12','var13','var14',var15,var16,var17,var18,var19,var20,var21,var22,var23,‘var24','var25'];

var1 = Title Bar Text Color (Example = ‘#FFFFFF’ )

var2 = Body Text Color (Example = '#5E00D5’ )

var3 = Title Background Color (Example = '#721CFF’ )

var4 = Body Background Color (Example = ‘#000000’ )

var5 = Title Background Image (Example = ‘./Graphics/title.JPG' )

var6 = Body Background Image (Example = ‘./Graphics/body.JPG' )

var7 = Title Text Align (Example = ‘Right’ or ‘Center’ or ‘Left’)

var8 = Body Text Align (Example = ‘Right’ or ‘Center’ or ‘Left’ )

var9 = Title Font Face (Example = 'Arial' )

var10 = Text Font Face (Example = 'Arial' )

var11 = Tip Position From Mouse (Example = ‘Right’ or ‘Center’ or ‘Left’ )

var12 = Sticky Style (Example = ‘popup’ or ‘sticky’)

var13 = Title Font Size (Example = ‘1’ or ‘2’ or ‘3’ or ‘4’ ect...)

var14 = Text Font Size (Example = ‘1’ or ‘2’ or ‘3’ or ‘4’ ect...)

var15 = Width (Example = 100 or 150 or 200 or 250 ect…)

var16 = Min Height (Example = 100 or 150 or 200 or 250 ect…)

var17 = Border Size (Example = 1 or 2 or 3 or 4 ect...)

var18 = Text Spacing From Border (Example = 1 or 2 or 3 or 4 ect...)

var19 = Coordinate X From Mouse (Example = 10 or 15 or 20 or 25 ect...)

var20 = Coordinate Y Mouse (Example = 10 or 15 or 20 or 25 ect...)

var21 = Transition Number (Example = 1 or 2 or 3 or 4 ect... (1 – 52) )

var22 = Transition Duration In Seconds (Example = 0.1 or 0.2 or 0.3 or0.4 or 0.5 ect…)

var23 = Transparency Level Visible % (Example = 100 or 90 or 80 or 70 or 60 ect… )

var24 = Shadow Type (Example = ‘complex’ or ‘simple’) (simple=solid shadow, complex= fading shadow)

var25 = Shadow Color (Example = '#FFFFFF' )

Note: If you see ‘ ‘ make sure they are there.

Note: Background Images will tile if smaller than area, also will only show image as large as area is.

It should end up like something like this:

Style[0]=['#FFFFFF','#5e00d5','#721cff','#000000','./Graphics/title.JPG','./Graphics/body.JPG','Right','Left','Arial','Arial','Right','popup','2','2',250,0,2,4,10,10,24,0.1,100,'complex','#FFFFFF'];

Now if you want a different Style in each theme you will need to do the following:

Open up the “WPI.HTM” with in the theme folder

Locate this line:

<head>

Add this under that line:

<script
	language="JavaScript1.2"
	src="./themes/Glossy/style.js" 
	type="text/javascript"
	APPLICATION="yes">
</SCRIPT>

Note: make the “scr=” point to the correct folder!

Save and close!

Now create a new file in the theme folder called “style.js”

Open up the “style.js”

Add the “Style[0]=[“ line to look something similar to

Style[0]=['#FFFFFF','#5e00d5','#721cff','#000000','./Graphics/title.JPG','./Graphics/body.JPG','Right','Left','Arial','Arial','Right','popup','2','2',250,0,2,4,10,10,24,0.1,100,'complex','#FFFFFF'];

Save and close!

Then Test.

Enjoy the feature. (Note: These options are included into a new wizard in future release)

Link to comment
Share on other sites

almulder

almulder

Posted
  • Author
Posted

This edit section:

Style[0]=['#FFFFFF','#5e00d5','#721cff','#000000','./Graphics/title.JPG','./Graphics/body.JPG','Right','Left','Arial','Arial','Right','popup','2','2',250,0,2,4,10,10,24,0.1,100,'complex','#FFFFFF'];

Link to comment
Share on other sites
lionhrt

lionhrt

Posted
Posted (edited)

Almulder hate to be a bother , tried to get it to work, but unfortunately its not coming out the way i want. As you can see the titlebar tiles. as noticed on the top and the sides.

how do I manage to keep the width of the titlebar, and automatically expand the height according to its contents.

http://img367.imageshack.us/my.php?image=thelook5yh.jpg

Attached are the three files modified:

style.js, wpi.htm, and config.js

Any help would be appreciated.

EDIT:

My titlebar image is 270Wx71H . I would like to keep the box so that its stay 271 W, but be able to expand to whatever is needed. P.S i dont use a background image for the box so i edited the code to from this './Graphics/body.JPG' to this ,'','Right','Left','Arial','Ari.........

EDIT2:

almulder uploading to my host. Im on a slow connection so will take a couple of minutes.

http://www.mnsi.net/~lionhrt/WPI_lionhrt.rar

lion.rar

Edited by lionhrt
Link to comment
Share on other sites
j_h3000

j_h3000

Posted
Posted

hay lionhrt i found something that might help

the exact dimentions of the title bar should be 350*15 pix

lhurt8he.th.jpg

so now if you see the pic you'll find out that its not tiling horizontaly any more but there is the border problem left

still working to figure out whats wrong and if i found any thing else i'll let you know

Link to comment
Share on other sites
almulder

almulder

Posted
  • Author
Posted

To fix the border problem you will need to make some chnages to the pic file.

First what size of border are you using?

If it is "3" then make the first "3 pixels on the left and right and bottom of the pic the way you would like your border to look.

The problem being is that the pic is tileing down until the bottom.

Still working on finding the code where it dose this, but for now this will fix the problem.

Link to comment
Share on other sites
lionhrt

lionhrt

Posted
Posted

Thanks mate, will give it a shot too see.

@j_h3000

"the exact dimentions of the title bar should be 350*15 pix"

If I did this i"m sure all it would do is tile 15 windows side by side @ 350 pixels wide.

Thanks for the help all

Link to comment
Share on other sites
lionhrt

lionhrt

Posted
Posted

Well mates, almulder or whoever is listening. I have managed to get it to this point.

I modified the border to 0 but still have 2 things:

1 the graphic on top seems to be cut off, how can that be adjusted in the code to acepts is true dimensions of 274x23

2 still need help as previous member wondered is there a way to wrap the text around image so its flush.

Sample Below

post-44350-1124702438_thumb.jpg

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...