Viewing About Sticky Note
About Sticky Note
|
User: Yuanbo L. 12 years ago
|
|
|
Hi, I'd like to add sticky note to EverWeb, and I've found this useful page, please refer to the link http://www.dynamicdrive.com/dynamicindex17/stickynote.htm# it says the codes references to external files and I should download them, and my question is 1) after I download them should I upload them anywhere? cuz it does not explain in details, and 2) How can I do it in EverWeb? 3) The HEAD section thing is confusing me, what is HEAD section? where is it? Thank you in advance for your kind help!!! VL ------------------------------- Yuanbo Li |
|
|
User: Roddy 12 years ago
|
|
|
Copy the javascript and paste it into a new doc in TextEdit.app. Make sure text edit is set for plain text in preferences. Save the file as stickynote.js and drag it into the Assets List in EverWeb. Paste this into the Head Code box in the Page inspector… <style type="text/css"><br /> .stickynote{<br /> position:absolute;<br /> visibility:hidden;<br /> width: 300px;<br /> border: 2px solid #000;<br /> background-color: #fff;<br /> padding: 4px;<br /> box-shadow: 3px 3px 8px #818181;<br /> -webkit-box-shadow: 3px 3px 8px #818181;<br /> -moz-box-shadow: 3px 3px 8px #818181;<br /> }<br /> </style><br /> <br /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script><br /> <script src="stickynote.js" type="text/javascript"></script><br /> <script type="text/javascript"><br /> var mysticky=new stickynote({<br /> content:{divid:'stickynote1', source:'inline'},<br /> showfrequency:'always',<br /> hidebox:5<br /> })<br /> var mysticky2=new stickynote({<br /> content:{divid:'stickynote2', source:'stickydata.txt'},<br /> pos:['right', 'bottom'],<br /> showfrequency:'always'<br /> })<br /> </script> Find the stickynote.js in the Assets list and control (right) click it to get the relative file path. Now highlight stickynote.js in the above script and paste the relative file path in its place. Copy the next part of the code into a new doc in Text Edit… <div id="stickynote2" class="stickynote"><br /> Use this <a href="http://tools.dynamicdrive.com/gradient/"><b>Online Gradient Tool</b></a> to painlessly generate a gradient image of 3 types, with instant previewing so you get exactly what you had in mind. <a href="#" onClick="mysticky2.showhidenote('hide');return false">[Hide Box]</a><br /> </div> Replace the default text with your own. Now copy it again, paste it into an HTML Snippet on the web page. Adjust the snippet box to about 325px wide by about 200px high. All you will see in EW is an empty box! Either publish to a local folder or use the Preview button to see the finished result. ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
✔ Best Answer
|
|
|
User: Yuanbo L. 12 years ago
|
|
|
Hi Roddy, Thank you for your information, But this "Now highlight stickynote.js in the above script and paste the relative file path in its place." I don't quite understand, how do I highlight? and paste the relative file in its place, "its place" you mean where? Waiting for your reply ------------------------------- Yuanbo Li |
|
|
User: Yuanbo L. 12 years ago
|
|
|
Hi Roddy, I have zero knowledge about those terminology terms, is it possible to give me more step by step details? thanks!!
Last edit 12 years ago ------------------------------- Yuanbo Li |
|
|
User: Roddy 12 years ago
|
|
|
Select it and paste the content of your clipboard over it. You will be changing this… stickynote.js … to this… {!-ASSETSPATH-!}External%20Files/stickynote.js ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
User: Yuanbo L. 12 years ago
|
|
|
Quote: Roddy - 15/02/2014 6:10:29 Select it and paste the content of your clipboard over it. You will be changing this… stickynote.js … to this… {!-ASSETSPATH-!}External%20Files/stickynote.js Hi Roddy Thank you for your advices, I finally made it work. Just one quick question, I noticed the box is set to go off after 5 sec, but when i preview the page, the box I mean the sticky note never go off, did I do anything wrong? How do I fix this? Thx ------------------------------- Yuanbo Li |
|
|
User: Roddy 12 years ago
|
|
|
The display time is in the javascript… var mysticky=new stickynote({ content:{divid:'stickynote1', source:'inline'}, showfrequency:'always', hidebox:5 }) This means 5 seconds. If it is set to zero the box doesn't dismiss. ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
User: Yuanbo L. 12 years ago
|
|
|
Thx, Roddy!!! Great help!!!
------------------------------- Yuanbo Li |
|
| Post Reply |
| You must login or signup to post. |