Using flexslider to display multiple fancybox galleries - fancybox

I have a few fancybox galleries in thumbnail format and I would like to use flexslider to shift between them.
I'm trying to accomplish something like this: http://www.herschelsupply.com/lookbook/
Is this possible, and if so, what do I need to do?
I've looked around quite a bit and I know it's possible to run multiple galleries on the same page, but I haven't seen any comments on a setup like the one above.
Thanks for your help!

Related

Tips of making a list in email

I am designing an email template. I have a running list of brand names hyperlinked to their websites. I would like it to be displayed inline for full-width, and stacked for narrow screens. I had separators in the past like a bullet or a vertical rule such as this: "|". But in mobile it's awkward considering only one name appears per line.
The next thing I tried was to enclose each list item in a border, but Outlook10/13 aren't handling the padding and margin as you know. I want a simple solution that I can show to novices when they populate the template. Any ideas? I'm adding screenshots of what I tried with the borders. But any other idea is welcome.
Thanks!!!
Full Width:
Mobile:
I have tried a lot of ways myself and one thing i found out was having logos in place of links often work better. I know images have to be downloaded but once they are downloaded it looks good. If you do go with images, you can style the alt tags to look like above when its not loaded.

Easier usage with markdown

I am trying to use this from my markdown text. I want to show an image and clicking that will open in a lightbox. I am using something like below now:
![Hugo](https://raw.githubusercontent.com/spf13/hugo/master/docs/static/img/hugo-logo.png)
Is there a way to achieve this without writing the url twice?
You could bind featherlight on the <img> tag and use the targetAttr to get a similar effect.

draggable layouts from elements. like gridster.js

I would like to have a page with draggable elements. Something like this
gridster demo
The only difference is that I would like the user to have the option not only to resize but to hide and show the elements as well. (something like a dashboard)
the closest I came to is this :
angular dashboard but sadly I don't want to use angular.js
I would like to see if you guys know of any libraries like that.
thanks

Fancybox working on local but has gliches on server

I am new at fancybox and am having trouble. I think I have done it right, according to what the fancybox site says. I have a few images and wanted to hide all but one and then have a slide show. This worked great when I was working local but now it is missing a bunch of styling it seems and it is not hiding the other images.
Here is one of the pages:
http://josborneanderson.com/design/farmers.html
It looks like you are missing this file on your server.
http://josborneanderson.com/fancybox/source/jquery.fancybox.css?v=2.1.5

How to add the Zoom effect on our own website

I would like to have the effect like Facebook Theatre Mode on my website. But where to find the sample? I need one, the effect is when we click on the photo from the photo album then another pop-out layer on the top of the website. It is something like this:
http://www.youtube.com/watch?v=31FG9yONqVo
https://chrome.google.com/webstore/detail/elioihkkcdgakfbahdoddophfngopipi
But I only get the code to disable it and not full code.![A white pop-up layer display above the web page. Anyone has any idea how to do this or any example for me to follow? Truly need help and appreciate much for helping!][1]
You can take help from the below scripts or adapt as per your need...
http://www.intenseblog.com/design/8-amazing-javascript-image-zoom-scripts.html