Web app using isotope plugin - repost

  • Status Completed
  • Budget $30 - $250 USD
  • Total Bids 6

Project Description

I have created a an image gallery web application and im using Isotope Jquery plugin to display the div boxes that contain the images in masonry style.

* I have four main sizes for the div containers

DIV A - width: 100px ; height: 100px;

DIV B - width: 220px; height: 100px;

DIV C - width: 340px; height: 210px;

DIV D - width: 220px; height: 210px;

* The div containers are dynamically generated.

* Each div container contains an image when generated from database.

* Images are not predefined in terms of width and height, they called randomly in each div container.

* IMPORTANT - When the image is loaded into a div, it must fit appropriately in its container, keeping in mind the margins inside div. This applies to all divs A,B,C,and D.

* IMPORTANT- The four sides of the margin inside the div container must remain static regardless of the images width and height.

* Aspect ratio of the image must be kept into consideration.

* If necessary, image stretching can be applied if image width or height does not meet with div containers width or height.

* If necessary, image cropping can also be applied appropriately if image width or height does not meet with div containers width or height.

Expected advisory:

1- Proper sizes of div containers for a good masonry layout using isotope, keeping in mind the image attached for current masonry layout.

2- positioning image inside div container properly in all scenarios A,B,C,and D with proper margins on all sides of container. Check attached images.

Get free quotes for a project like this
Completed by:

Looking to make some money?

  • Set your budget and the timeframe
  • Outline your proposal
  • Get paid for your work

Hire Freelancers who also bid on this project

    • Forbes
    • The New York Times
    • Time
    • Wall Street Journal
    • Times Online