How To Stick A Post-It on My Web Page?

[abrogard]

I'm not sure which forum this question belongs in. Hopefully this is a good place. If it is wrong maybe a moderator could move it.

I want to take one of my web pages and 'stick a post-it' on it.

Or that's what I want it to look like. As though I had just slapped a post-it on it.

And if that can't be done I'd like to know it, from authoritative sources such as the programmers and developers in these forums. Then I'll stop trying.

Failing that I wonder about the idea of building a whole page from scratch in a sort of post-it way.

Thinking that from scratch allows starting off with a suitable methodology where trying to 'slap something' onto a traditional, normal webpage might be not possible.

Something like putting areas (rectangle, square, circle, whatever) down onto that page wherever, willy-nilly and slapping more on and more on until it is full, some obscured, partly obscured... like that.

Kinda really treating the page area the way we physically treat our desktops...

These areas need only be text areas. Good if they could contain graphics but text would be a good start.

Seems to me it is simply not possible to do it or anything like it.

Unless everything is a graphic, everything is a picture. then I'd have to map the picture to get functionality.

Guess that's what they do with games. Areas of the graphic mapped... mouseover and mouseclick start an event....

With that in mind perhaps there's software available nowadays to make preparing such screens quick and easy? And even open source freeware to do it?

If so I'd like to know.

Failing special software what would be the way to go for this effect now, with what we've got?

[Kraai]

I think what you will need to do here, is to design a theme/template to look like a stick-it note template, or maybe you can search google for existing templates that look like what you want.

However, if jou need to display stick-it notes on an existing webpage with a normal theme and layout, your best bet is to find stick-it generators online, where you can get the code and copy it into your html file.

Here is an example of such a service, where you can generate your own stick-it notes and copy the code. I will not reccommend it however, because it links back to the creator webpage.

[abrogard]

I think what you will need to do here, is to design a theme/template to look like a stick-it note template, or maybe you can search google for existing templates that look like what you want.

However, if jou need to display stick-it notes on an existing webpage with a normal theme and layout, your best bet is to find stick-it generators online, where you can get the code and copy it into your html file.

Here is an example of such a service, where you can generate your own stick-it notes and copy the code. I will not reccommend it however, because it links back to the creator webpage.

Thanks for the post.

Designing themes/templates: No. Not quite what I want, I think. Like the generators provide code I could use for a template and they aren't what I want - see below...

Stick-it generators: I tried this one and if they are all like that then they're no good. They miss the point. A stick-it note lies on top of everything - you put it in a place where it obscures as little as possible of the screen, the book, the file, the page, the whatever...

This generator has provided merely a graphic that sits right in the middle of the page.

I could have done that myself and often have and I call it an image, not a post-it.

What they're providing is pictures, images, of a post-it. Not 'post-it' notes. These things don't 'slap down on top', these things become part of the bottom.

Where what we want is actual post-its. Things you can slap down anywhere on top of the existing screen, page, whatever.

Being fairly ignorant of html, php, perl, css, et al... but not totally ignorant I have surmised it might be possible to do something like 'post-it' with our web pages.

I know of scrolling text over a stationary background. The interesting thing about that being the way the background shows through. The scrolling isn't needed for a post-it.

So that scrolling text looks a bit like an overlay to me.

So I was surmising that maybe there's some way you knowledgeable code gurus know of to have an overlay accessed by a style which displays a message we write into the style sheet.

Different messages, different 'overlays', all just style sheet items.

Each one would be sort of an electronic equivalent of a 'post-it' note.

Could be many of these defined in the code but unused... style sheet entry blank.

But fill in the style sheet entry and bingo... there's a note.

But all that is just my dreamt up version of perhaps how it would work...

I can't do it. Don't know enough. And maybe in my ignorance I'm dreaming of something that just can't be done.

In which case... sorry...

:)

[Kraai]

I did some investigation, and found something that just might be a sort of solution to what you want. It is called hover-ads, and you can position them where ever you want them to appear on a webpage. See this example of a sticky note:

http://www.hover-it.com/samples/hsticky1.htm

And here you can read more:

http://www.hover-it.com/

It may still be not exactly what you want, and yes, maybe there is some coders out there that have a better idea.

[abrogard]

I did some investigation, and found something that just might be a sort of solution to what you want. It is called hover-ads, and you can position them where ever you want them to appear on a webpage. See this example of a sticky note:

http://www.hover-it.com/samples/hsticky1.htm

And here you can read more:

http://www.hover-it.com/

It may still be not exactly what you want, and yes, maybe there is some coders out there that have a better idea.

Well thanks for that. You've really found something there. I can see from the demo that the 'hover note' obscures the thing beneath it only where it is literally over it - that's exactly right. And I see from reading the stuff that came with the download that we can put html in the ads or 'hover notes' we create with their prog. So that'd be really good. And presumably the functionality ( i.e. all the links and whatever ) on the underlying page are still operative.

So it is virtually everything I want and more: I didn't ask for the hover ability.

BUT - they're not going to give me the code are they. I'm not sure if that matters. I might be satisfied using their app.

I'm not sure if we can put numerous notes on a page, must look into that.
Not sure if we can make the notes stationary, non-hover, must look into that.

And I see it is a Flash application. Must think about how I could perhaps do that myself.

So the upshot is I think you've very nearly cracked it for me - if I find the prog is all I need then you truly have.

I'd call the question answered but perhaps I should just hang on a bit and see if someone comes up with the code for us to do this ourselves (with or without the hover effect).

I owe you a big vote of thanks..

regards,

ab :)

p.s. I might just add an explanation of how I came to want this. I've got website pages that have stood there for eons and there's been developments that make me want to add something to them. In a couple of cases something quite dramatic like [ FINISHED ]. And that's all I want to do, I can't be bothered doing any more with them for now, I'm very short of available time and must prioritize.

So - rather than fumbling around with complicated code on a page and making room for such an announcement, and thereby changing all the underlying page - I found myself wishing I could just plonk a post-it on it the way I do with files, and be done with it, in a couple of minutes, and be able to see the original again at any time just by removing the post-it.

And that made me think of other things one could do with that methodology... but that's another story...

[Kraai]

I'm glad that the hover idea is helping. I always say that most things should be possible to do in websites. If I'm not mistaken, I'm sure you would be able to stick more than one note on top of an existing page, and position them the way you want to, and be able to set it stationary as well.

Would like to see your site someday when your done with it.

Good luck