PDA

View Full Version : Script:Sticky Note script



imnopro
05-16-2005, 06:58 PM
http://www.dynamicdrive.com/dynamicindex17/stickynote.htm

This script is perfect......but--is it possible to position the note in the upper right corner of the screen instead of the middle?

Thanks.... :)

jscheuer1
05-16-2005, 07:45 PM
These two lines control the positioning:


objref.style.left=docwidth/2-objwidth/2+"px"
objref.style.top=scroll_top+docheight/2-objheight/2+"px"change them to:
objref.style.left=docwidth-objwidth+"px"
objref.style.top=scroll_top+"px"You will also want to change the static positioning line (which appears later in the code and looks like the initial top positioning line but without a left positioning line with it):
objref.style.top=scroll_top+docheight/2-objheight/2+"px"to:
objref.style.top=scroll_top+"px"That will put the thing in the exact upper right corner but, you might want to introduce a slight offset, like so:
objref.style.left=docwidth-objwidth-10+"px"
objref.style.top=scroll_top+10+"px"and:
objref.style.top=scroll_top+10+"px"respectively. The number 10 can be changed for a larger or smaller offset.

imnopro
05-16-2005, 09:09 PM
Thank you so much!! Works great. :)

fmv503
05-23-2005, 11:50 PM
http://www.dynamicdrive.com/dynamic.../stickynote.htm

Wow! What an awesome site!

I am attempting to insert the Sticky Note in FP 2000 and am getting an error message - "docwidth is undefined"

Just like the original poster - I need to get the note over to the left some. I entered the corrected code that was given in this post and the following:

objref.style.left=docwidth-objwidth-10+"px"
objref.style.top=scroll_top+10+"px"

Thanks for any help provided.
fmv

jscheuer1
05-24-2005, 02:39 AM
getting an error message - "docwidth is undefined"That means the script is not working for some reason as, installed properly, docwidth is defined.
I entered the corrected codeJust to be clear, there was nothing wrong with the code to begin with. It simply positions the note in the center of the page, if you want it elsewhere, then the code needs to be changed, not corrected.

Anyways, were you getting the error before you tried changing the code or after?

fmv503
05-24-2005, 09:49 PM
Hi and thank you for your help -

I meant to say revised instead of corrected! :D

I have been working on this today and found where I made my initial error in revising it. I have it working just as it is written, without any revision EXCEPT I have inserted my html, deleted the Dynamic Drive box, to see where/how my box would be positioned. Since I am using FP 2000, I have it in the same directory as all the other htmls.

This is what I have between the DIVs (I copied and pasted). There is no reference to the link DD that is in the code:

<DIV id="fadeinbox" (For purposes of posting I removed this - it is still in tact in FP)

INSERT ANY HTML TO DISPLAY HERE. DO NOT REMOVE OUTER MOST DIV.<br>
Script <a href="fade-box.html"></a><br>

<div align="left"> <a href="#" onClick="hidefadebox();return false">Hide Box</a>
</div>
</DIV>

I am so hoping I can get this right as it would make such a nice addition to the website I am working. Any help is greatly appreciated.

I have attached a screen shot to show what I am seeing.

http://www.ados.com/~vanover/sticky-fmv.jpg

I am hoping to move it over to the left some - for some reason, even with the Z-index it is partially going behind the table on the right. Someone else designed it so...I hope that I have provided enough information.

I have uploaded the html, should you care/need to see it.

Once again - thank you!

Frieda

jscheuer1
05-25-2005, 08:11 AM
To move it to the left of center, assuming you are now using the original code:
objref.style.left=docwidth/2-objwidth/2+"px"this should do it:
objref.style.left=(docwidth/2-objwidth/2)-50+"px"to move it 50px to the left, adjust the number 50 to suit. Probably the z-index on the table is equal to or greater than the box and is parsed later by the browser. If that doesn't do it for you and you would like it to display over that table yes, I would need the address to check things out.

fmv503
05-31-2005, 12:44 AM
Hi John -

My computer died last week so I couldn't let you know that even though I have inserted my http: address, I am still getting the box that Dynamic drive links to.

This is what I have: (Copy and pasting inserted the smilies - sorry - the code is correct)

<DIV id="fadeinbox" style="filter:progid:DXImageTransform.Microsoft.RandomDissolve(duration=1) progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135) ; -moz-opacity:0">

INSERT ANY HTML TO DISPLAY HERE. DO NOT REMOVE OUTER MOST DIV.<br>
Script <a href="http://www.ados.com/~vanover/fade-box.html">Dynamic Drive</a><br>

<div align="right"> <a href="#" onClick="hidefadebox();return false">Hide Box</a>
</div>
</DIV>

Everything seems to be working except for that.

Thank you so much for all your help!

Frieda

fmv503
05-31-2005, 04:56 PM
I thought it might be helpful if I posted a screen shot of what I have. I am having NO troube with the scrit in the Head section.

My Link (http://www.ados.com/~vanover/mylink.gif)

Image that keeps coming up (http://www.ados.com/~vanover/image.gif)

Picture of my HTML Page (http://www.ados.com/~vanover/fade-box.html)

It seems like this should be straight-forward but somehow I must be missing something! I have tried various things, including looking at some other webs that have included this...still no luck.

Thank you.

Frieda

jscheuer1
05-31-2005, 05:10 PM
Try:


<DIV id="fadeinbox" style="filter:progid:DXImageTransform.Microsoft.RandomDissolve(duration=1) progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135) ; -moz-opacity:0">
<img src="http://www.ados.com/~vanover/fade-box.html">

<div align="right"> <a href="#" onClick="hidefadebox();return false">Hide Box</a>
</div>
</DIV>

fmv503
05-31-2005, 05:23 PM
Still the same Dynamie Drive box - only the box is empty now!

Can I send anything else that might help?

jscheuer1
05-31-2005, 05:27 PM
I meant:


<DIV id="fadeinbox" style="filter:progid:DXImageTransform.Microsoft.RandomDissolve(duration=1) progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135) ; -moz-opacity:0">
<img src="http://www.ados.com/~vanover/images/fade-box2.gif">

<div align="right"> <a href="#" onClick="hidefadebox();return false">Hide Box</a>
</div>
</DIV>If that doesn't get it, a link to your page would be in order for diagnosis

fmv503
05-31-2005, 05:57 PM
Works Great!! I can work with this - thank you very much. I hope I won't have any trouble tweaking it now. Again, your help is so appreciated.

Frieda :D

ScorpionHD
12-02-2008, 07:07 PM
Hi I used this code inorder to position the box to the left of my page, the only problem I am running into is firefox is off by about 5 px then IE I am catering towards IE right now because thats what most users use but I would like to have it working for both.

To move it to the left of center, assuming you are now using the original code:
objref.style.left=docwidth/2-objwidth/2+"px"this should do it:
objref.style.left=(docwidth/2-objwidth/2)-50+"px"to move it 50px to the left, adjust the number 50 to suit. Probably the z-index on the table is equal to or greater than the box and is parsed later by the browser. If that doesn't do it for you and you would like it to display over that table yes, I would need the address to check things out.

I am not too strong in writing the code but I can figure my way out
heres my website link http://www.massagebysst.com

jscheuer1
12-03-2008, 04:17 AM
What happened to the px?

ScorpionHD
12-03-2008, 05:11 PM
I tried using the +"px" but the problem was that it didnt cater to all resolutions I have a reakky wide 1680x1050 but the client that I am making this page for is on 1024x768 so on my screen it was fine on her screen you can only see a little bit of it because it was so far off screen. How do I set it to be right on the left side of the screen and 108 pixels down from the top and be able to scroll?

jscheuer1
12-03-2008, 05:31 PM
Using px units won't change what you have, just make it work, just make sure to tell the script where you really want the thing, ex:


objref.style.left=0+"px"

ScorpionHD
12-03-2008, 05:46 PM
hehehe noobie mistake :P THanks for all your help and quick responses!