We Keep Coding

How to sort different sized pictures to fit in the screen?

I want this:
http://i.imgur.com/UFtITOi.png
to be fixed in this:
http://i.imgur.com/fzmMwHM.png
I prefer Javascript but you can shoot different approach.
It will be a lot easier if there is already algorithm so I can have a look at it.
Thank you!

Here is a GitHub project that does bin-packing in javascript. You can use this to assign positions to your html canvas drawings:
https://github.com/jakesgordon/bin-packing/
And this code is described in this post:
http://codeincomplete.com/posts/2011/5/7/bin_packing/
If you just need to position DOM elements, here are some libraries that do rectangle fitting:
http://masonry.desandro.com/options.html
http://isotope.metafizzy.co/ (using the masonry option)
http://packery.metafizzy.co/#getting-started

Is there a way to change an image's color scale in JavaScript?

I was wondering if there is a way to change an image color scale in JavaScript? Say you want to make it warmer or cooler depending upon the user's input. If there is a way in jquery or html5 that would be fine as well. Anyone know how to accomplish something like this?

HTML 5 has lot more features than what you just looking for. Anyhow the CANVAS container is the solution that i could say, where you can play with the color, pixels of image. . Have a look at this this. Hope this can help you to start

Maybe not in jquery itself but there is very cool js library for manipulating images called pixastic.
http://www.pixastic.com/
Try to search documentation for option you need exactly.

My guess is you want to change the saturation. I tried Pixastic but it's broken in my browsers, Chrome, Opera and IE7.
Caman JS looks like it delivers, at least judging from the demo page
http://camanjs.com/examples

Best Panorama Jquery plugin for images with this format

i need to replace my old FLASH panorama viewer by a jquery/javascript version.
If you check, you will see that the walls/corners/edges are rounded so you seee it normal when you apply the panorama effect,
the problem is that with all the jquery panorama plugins i get this resutl: http://toniweb.us/m/demos/salleformation.html (the image is only left animated. So the rounded, still rounded)
Do you know any good solution that can work with this kind of images?
PS: what is this format name?

Did you try also http://jquery.vostrel.cz/reel ? But I fear not a solution for your specific problem.
So you could try this site, carefully reading its stuff: http://webuser.fh-furtwangen.de/~dersch/mp/MotionPanoramas.html

I just came across this plugin. You'll be needing something like this (though it's far from perfect) :
http://code.google.com/p/jspanoviewer/

Adaptive FitText: is there a better way to do it?

I have a piece of code that adapts FitText.js to custom media queries. I wanted it to have different values for each predefined media query.
The code works, but it is by far ugly and by far not optimal.
http://jsfiddle.net/rKFYs/9/
I've tried recoding it but my js skills are not that good.
JS Gurus, please help!

I wrote a remix of FitText a little while back that will do its best to scale your text to fit its container element (see http://blog.rjzaworski.com/2011/11/fit-text-to-element-inflatetext-js/).
Using this variation on the FitText concept, you would simply need to adjust the size of the container div in your media queries and let the plugin scale your text to fit.

I actually ended up writing my own plugin called AdaptiveText.js check it out!

Maybe this answer that I just wrote in other question about a similar problem can help you

How to split page and reveal stuff underneath?

I've already achieved this on my iPhone app, but I want to know if it's possible on an HTML page, maybe using CSS effects or similar.
As you can see, the current view is split, the bottom part is moved down, and another view is revealed underneath. I have a page I'd like to try this on. Any ideas if this is possible, and any specifics as to how I can do it? I'm quite new to HTML coding, so please take it easy on me. :)
Thanks in advance!

Here's an example to get you started http://jsfiddle.net/Cquhj/
A few things to take away from this pattern:
The middle div has an overflow: hidden; property and height: 0px.
The trigger icon has an event that tweens the height of the middle div to the size you want.
Edit:
I really like the resources and answers given and I would add this to the list http://wiki.forum.nokia.com/index.php/Mobile_Design_Pattern:_Accordion_Menu

here an update, more iphone-like
http://jsfiddle.net/mFeyn/1/
it miss the triangle in the bottom of the folder once is clicked and calculate the height of the container when there is more than 4 icons.

Yes, it's absolutely possible, nothing out of the ordinary and CSS will definitely be needed.
As it is, your question is extremely generic and an answer would be: learn about HTML and CSS and the combination of the two for creating standard compliant web page layouts. You might want to read about the box model too. To solve your problem you need to know about the use, positioning and floating of a series of <div>s to achieve the desired layout.
If you want to add animation, like some part of the split view floating down into position, you will need Javascript as well.
Possible starting points for your research on SO:
Why not use tables for layout in HTML?
https://stackoverflow.com/search?q=css+div+column

Here is a code example that might give you a little bit more if your plan is to emulate iOS 4 folder behaviour using jQuery.
The view is basically split into rows and I played around w/ the background position css attribute to allow the background split illusion.
http://jsfiddle.net/hKHWL/

This is very possible, but it's kind of like asking "I want to program Civilization, and I'm quite new to C; how do I do it?" ;-)
I would strongly recommend picking up a good "DHTML" (Dynamic HTML) book. For instance, I rather enjoyed this one, from SitePoint: http://www.sitepoint.com/books/dhtml1/
If you're not the book-buying type, sites like SitePoint and AListApart can certainly explain things too, but not in as organized of a format.
Good luck.

I know this is an old post/question...
but I'm doing this with dynamic heights and positions here:
http://webkit-os.pixelass.com/iframe/
(only works in Chrome and Safari)
I am using jQuery and two divs with the same image.
Dynamic positions means.. you can move the folder to a different position or page.
Dynamic height means... the height is relative to the number of Icon-rows in the folder.
The folder even opens above and below if the content is too hight to be displayed below.
(opening the folder from the Dock does not work yet)