Flickr style thumbnail page - css

How is Flickr Explore thumbnail grid page done? Is this possible using bootstrap and still retain the responsiveness of the images? I checked the Flickr page and it seems that those images are set as background-image.
Is there any similar CSS technique to copy that effect?

Related

Lightbox CSS conflict

I had lightbox on my site and it was working fine. I updated the pages with Dreamweaver CS6 to a Fluid grid with a side navigation bar so the site would be more mobile friendly. The result is that my lightbox images are distorted and the frame is missing from one side. When scrolling through the images they will increase in size by a fraction and distortion will lessen. I figure there is a CSS conflict and I can't figure it out. Web page is located here,
http://www.crawfordcountyhistoricalsociety.org/Pages/Indians.html
U should remove this style, max-width:100% and padding: 10px.

Is there a wordpress theme/plugin for this background-image effect?

I'm looking for a wordpress theme or plugin that will let me mimic the background image effect found on this website. I'm referring specifically to the way the fixed background image changes based on the scroll position. I.e. if you're at the top of the page, the background image is the man at the lockers. If you're at the bottom, the image is of the band.
I know it's possible to do this with javascript, but I'm wondering if there's a theme that incorporates this effect.
You'll find a lot of themes out there that have the parallax background scrolling effect: https://themeforest.net/tags/parallax?category=wordpress&referrer=search&utf8=%E2%9C%93&view=list (these are the results for WP themes with the "parallax" tag)
There are a few plugins as well, such as this one: https://wordpress.org/plugins/adamrob-parallax-scroll/

Make wordpress downloaded theme header image responsive

I have downloaded wordpress theme Parallax One. I have given a header image, but its not responsive.
I just put an image over the header image, but the image in the top is responsive and the header image not responsive. I want make both images responsive, now it look like this when re-size the window. Thank you so much in advance.
Just created a div and created own responsive css code on wordpress and given the image in that div.It is responsive now.

grid products gallery plugins wordpress

did anyone know Wordpress Plugins Grid Products Gallery with left-right image display for each item. for example like this URL http://mwa.eu/products/ ?
is there any wordpress plugins or template like that?
It could be easily done by changing CSS on every second image element of the grid from float left to float right.
If you have some experience in CSS and HTML it's a 5 minutes work, assuming you have some basic layout.

Tumblr photoset custom width?

I'm trying to get Tumblr's photosets to appear 640px wide.
I'm modifying CATCHING ELEPHANT for my blog http://assemblyradio.tumblr.com/
I'm making the whole posts section of the theme wider.However, I can't seem to get photo sets to appear 640px wide.
I would like the sets to show up as Tumblr intended with their fancy layout, because they look great. Therefore this solution is not what I'm looking for:
Change default photoset size on tumblr
I have tried java script from here:
Tumblr theme dev: Square-75px photos for Photoset posts
and here:
Change default photoset size on tumblr
The second script sort of worked but the images are cropped off =(
If I add some custom CSS I can get the iframe to be 640px wide, but then the height does not adjust accordingly!
Everytime I think I figure it out on Chrome's web developer tool, I can't seem to get the code right in Tumblr's custome CSS. I thought using this selector gadget [How can I get the CSS Selector in Chrome?
could help me target exactly what CSS I should be editing (to see if that could help) but it can't tell me the path to the element, maybe because it's an iframe.
Does anyone know how to to get custom photoset width?
Or how to get an iframe height to adjust automatically?
Or how to find a complicated path to a class?
Any help would be much appreciated. I just want to see my cute kittens.
Thank you!
Tumblr's limitations had also been annoying me, so I wrote a jQuery plugin for a fully responsive Photoset layout that uses Tumblr's style. It also includes extra information (that can be toggled on/off) for EXIF and caption data on each photo.
https://github.com/PixelUnion/Extended-Tumblr-Photoset

Resources