Tagged: slider
-
AuthorPosts
-
April 7, 2014 at 6:14 pm #248344
Ok Support, here is a REALLY important question that I am sure anyone who works with images on their website will want to know, ESPECIALLY photographers. Do ANY of the build in Sliders off a simple way to SCALE, but not crop images? There are many dimension or size options, BUT they ALL cut off the image, usually at the worst place, like cutting off a head or the photo watermarks.
So the only option is use the Full size no scale option, but they the images are often way to big to fit in one page. I do not want to resize and reload ALL my images, but doing so would take away detail I want visible if the client decides to open the image in a large Lightroom box.
Any suggestion, do I need a third party plugin, or worse a new theme to do this??
Thanks again
SteveApril 9, 2014 at 2:27 am #249012Hi steveinz!
If you choose the full-width approach here is a plausible solution to your problem.
Find the images you want to apply the following class, what i would do is apply this to element container and target the image.
//The use of capitals is just to let you know you can name it however you want :) this technique is used by twitter bootstrap in btw. ( though they apply this to the image itself, you can do that too. <div class"CUSTOM-CLASS-TO-REDUCE-IMAGES-WITHOUT-CROPPING"> <img .....> </div> .CUSTOM-CLASS-TO-REDUCE-IMAGES-WITHOUT-CROPPING img{ display: block!important; height: auto!important; min-width: 100%!important; }
Want to apply this to all of the images ?
img{ display: block!important; height: auto!important; min-width: 100%!important; }
Best regards,
DavidApril 10, 2014 at 10:14 pm #249947Thanks for the reply, but this is not clear;
Can you clarify
1) where this code for a custom class would go?
2) This SEEMS to be setting the width to 100%, but random height, I need the set the height to always fit on the screen, and adjust the width for each image instead. Can I just it to height: 100% and width: auto?thanks
SteveApril 11, 2014 at 7:49 pm #250361Hey!
Have you tried using the fullwidth easy slider? http://kriesi.at/themes/enfold/shortcodes/easy-slider/
It doesn’t crop anything and adjusts based on the image itself.
For the above, you can add custom classes to images themselves in a regular text tab (not using the ALB) or if you want to try it it on the ALB elements you can turn on the custom class field with this function: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
Regards,
DevinApril 17, 2014 at 10:45 pm #252935Hey, thanks again, but still not clear, can I paste this custom class code right into the Custom CSS Class field in ALB, OR do I need to create the code in some CSS or PHP file and then reference the class name in the ALB somehow??
THANKS!
April 20, 2014 at 5:06 pm #253596The custom class field is for the class selector. It adds that selector to the element on the front end. You then add the rule for that class to your Quick CSS.
As I mentioned before the fullscreen elements must crop images in order to work and trying to force it into any other configuration is a difficult and unsupported route.
October 4, 2014 at 9:21 am #330140Hello Steveinz,
I was asking the same question. Did you solve your problem? How?
Kind regards
Gerhard
-
AuthorPosts
- The topic ‘slider that automatically scales but does not crop’ is closed to new replies.