"Full Width Text" slide type top-margin and bottom truncation
Permalink Browser Info Environment
This is not a question. I made these customizations to suit our needs.
We chose the formigo-slider add-on because of it having a "full-width-text" type that we wanted to use for rotating quotes/customer testimonials - no images.
Nice add-on.
--------------------------------------------
For custom margins I put this style definition in our custom css stylesheet:
.formigo-slider-item-full-text * {
margin-left: 5px;
margin-right: 5px;
}
This should perhaps be changed to ems.
---------------------------------------------------------
To set the text to begin at the top of the block instead of a large top margin (was it vertically aligned?), I made this customization to the add-on:
siteroot/packages/formigo_slider/js/formigoSlider.js
edited in the else block with initial line:
// Handle (unlikely) scenario where slides are full width text only
// Reset Text
$('.formigo-slider-item-full-text').css({
// top: ($('.formigo-slider').outerHeight() - $('.formigo-slider-item-full-text').outerHeight())/2
// custom remmed above line and added next line to make text nearer the top of the block
top: ($('.formigo-slider').outerHeight() - $('.formigo-slider-item-full-text').outerHeight())/10
});
---------------------------------------------------------
To totally eliminate the inline style height specs which tended to truncate text regardless of block height setting at certain browser window widths. = seems to work nicely
siteroot/packages/formigo_slider/js/formigoSlider.js
edited in the else block with initial line:
// Handle (unlikely) scenario where slides are full width text only
// Handle (unlikely) scenario where slides are full width text only
// Establish relative height
var containerHeight = (sliderWidthTemp/sliderWidth) * sliderHeight;
// custom remmed next two lines to fix quote truncation at certain window width sizes
// $(".formigo-slider-item").css({'height':containerHeight});
// $(".formigo-slider").css({'height':containerHeight});
We chose the formigo-slider add-on because of it having a "full-width-text" type that we wanted to use for rotating quotes/customer testimonials - no images.
Nice add-on.
--------------------------------------------
For custom margins I put this style definition in our custom css stylesheet:
.formigo-slider-item-full-text * {
margin-left: 5px;
margin-right: 5px;
}
This should perhaps be changed to ems.
---------------------------------------------------------
To set the text to begin at the top of the block instead of a large top margin (was it vertically aligned?), I made this customization to the add-on:
siteroot/packages/formigo_slider/js/formigoSlider.js
edited in the else block with initial line:
// Handle (unlikely) scenario where slides are full width text only
// Reset Text
$('.formigo-slider-item-full-text').css({
// top: ($('.formigo-slider').outerHeight() - $('.formigo-slider-item-full-text').outerHeight())/2
// custom remmed above line and added next line to make text nearer the top of the block
top: ($('.formigo-slider').outerHeight() - $('.formigo-slider-item-full-text').outerHeight())/10
});
---------------------------------------------------------
To totally eliminate the inline style height specs which tended to truncate text regardless of block height setting at certain browser window widths. = seems to work nicely
siteroot/packages/formigo_slider/js/formigoSlider.js
edited in the else block with initial line:
// Handle (unlikely) scenario where slides are full width text only
// Handle (unlikely) scenario where slides are full width text only
// Establish relative height
var containerHeight = (sliderWidthTemp/sliderWidth) * sliderHeight;
// custom remmed next two lines to fix quote truncation at certain window width sizes
// $(".formigo-slider-item").css({'height':containerHeight});
// $(".formigo-slider").css({'height':containerHeight});
Type: | Discussion |
---|---|
Status: | In Progress |