I was asked to replicate a “star” effect, where stars appear in various areas around a page and then disappear after a while. I won’t bother linking to the original site as it will be gone shortly, but this is what I came up with:
To use this on your own site, simply download the script, link to it in your page, then add this piece of JavaScript.
$('body').stars();
If you want to use the star image I created, download it to the same directory and tell the plugin where it is:
$('body').stars({
"i":"stars.png"
});
About verens
Hi, Kae!
Just bought “Jquery 1.3 with PHP” e-book through PacktPub.com and started reading.
I’m still a beginner in both PHP (even though I’ve written a few applications in it) and JavaScript/jQuery (in this case, completely beginner).
I’d like to know if there’s a way to make the “Quick Deletes” work with jQuery 1.4 ’cause I can’t get it to work properly here (the rows don’t get deleted).
Thanks!
Fabio, writing from Brazil =)
Hi Fabio; yes, I’ve spotted that problem as well.
The problem is that jQuery 1.3 was okay with JSON such as this: {test:”test”,test2:’test2′}, but that’s technically not accurate.
jQuery 1.4 is a lot more strict, and insists that double-quotes must be used for both the names and values of parameters, so the above should be {“test”:”test”,”test2″:”test2″}
I’m hoping to do an updated version of that book next year, after my latest one comes out (in two weeks, I think).
Oh, I see. Thanks for the reply!
I’ll try to study a little more before asking again!
BTW: I’ve also pre-ordered “CMS Design Using PHP and jQuery” from PacktPub.
Thanks again!
Fabio, writing again from Brazil!
Fabio, no apology is necessary – the problem was not obvious!
I hope you enjoy the second book. It’s a bit “heavier” than the first, in that it describes in-depth the building of a CMS. I’d be interested to know what your impressions are!
Thanks, Kae!
I started with PHP in march, studying at home, but didn’t have much time ’cause I’ve been finishing a bachelor’s degree in advertising.
I’ve already tried do build a (very) small CMS, but the source code got all messed up. I’m still no good with classes and some functions.
I’m already having fun with this book (the way it was written is really easy to understand), so I think I’m going to have a lot of fun with both books (and A LOT to study too!).
And, as a plus, I get to study and practice english too (at least writing and reading)!
Thanks again!
Fabio
Hi Kea,
I can’t see demo page.
Thanks
@KulDuc – thanks! I was moving servers recently. looks like I made a mistake updating the DNS value for demo.verens.com – try again in a few hours.
Hey Kae,
I’m having troubles to use this plugin, it says “$(“body”).stars is not a function”. Can you help me?
Thanks in advance! And nice plugin!
@Nadia,
hi – are you running the $(‘body’).stars(); line immediately, or as part of an “onload” event?
you should make sure the line runs /after/ the HTML has finished loading, to make sure that the entire body element has finished rendering.
Hey, this looks neat but why does it look like the screen is vibrating?
Laura, my guess is that you’re viewing in Chrome? I just checked in Chrome and think I see what you’re talking about.
It looks like this is happening because Chrome is is rounding to the nearest pixel in some of its calculations, while Firefox is doing sub-pixel positioning instead.
No, im viewing in FF10 and opera next. I noticed something similar when i was making solid squares expand while staying in position, which i did by animating its css width/height properties while inversely moving its x/y position so that it would remain in place. It seems to be some strange quirk with browsers.
Hi, thank you for this great script! Is there any possibility to change the number of the stars? I just want to use the script in the head of the page and need more stars
Thank you! Lara
thanks Lara, you can change the desnsity of the stars by using the ‘d’ parameter.
$(‘#header’).stars({
“i”:”stars.png”,
“d”:.00005
});
for some more parameters, see the un-minimized script:
http://demo.verens.com/stars/stars.js
The un-minimized script is very cool, thanks a lot for the help and the script! Greetings from Germany
Just one question: Is there any possibility to make the div-container smaller, maybe 95%? Thanks!