Slider Indicator Position is not aligning as required

Web IT Solutions LLP
301 Posts
Web IT Solutions LLP posted this 3 weeks ago

Dear Sir,

This is not making sense, if we set the Slider Indicator Alignment to Right or Left it has to auto rotate to 180 degrees vertical alignment, i mean it has to stick to the left or right position of slider.

How to change the position to right or left, the indicators should adjust it accordingly towards the right or left position.. But, its not. Why ?

Please check the screenshot attached for your reference. This position is not making sense, i need some solution for the same. Any code CSS Change we can make it please let us know ASAP.

Appreciate your quick reply,

Thanks in advance,

Regards
Suffian Ahmed

Dear Sir, This is not making sense, if we set the Slider Indicator Alignment to Right or Left it has to auto rotate to 180 degrees vertical alignment, i mean it has to stick to the left or right position of slider. How to change the position to right or left, the indicators should adjust it accordingly towards the right or left position.. But, its not. Why ? Please check the screenshot attached for your reference. This position is not making sense, i need some solution for the same. Any code CSS Change we can make it please let us know ASAP. Appreciate your quick reply, Thanks in advance, Regards Suffian Ahmed
Vote to pay developers attention to this features or issue.
4 Comments
Order By: Standard | Newest
Web IT Solutions LLP
301 Posts
Web IT Solutions LLP posted this 3 weeks ago

We have used the css to adjust the indicator design... We are expecting the same by default as shown in the screenshot.

.bd-indicators-2 
{
    margin: 0;
    padding: 0;
    text-align: center;
    line-height: 0;
    display: inline-block;
    position: relative;
    z-index: 1;
    margin: -10em;
    -webkit-transform: rotate(90deg);
}

We have changed the style as above, CSS - margin: -10em & rotate(90deg) and its coming as expected. But, is that correct ?

Please share your update on this please. Find the screenshot for your reference.

We have used the css to adjust the indicator design... We are expecting the same by default as shown in the screenshot. .bd-indicators-2 { margin: 0; padding: 0; text-align: center; line-height: 0; display: inline-block; position: relative; z-index: 1; margin: -10em; -webkit-transform: rotate(90deg); } We have changed the style as above, CSS - margin: -10em & rotate(90deg) and its coming as expected. But, is that correct ? Please share your update on this please. Find the screenshot for your reference.
Support Team posted this 2 weeks ago

Hi,

Unfortunately, there is no rotate option for Slider indicators depending on the position. Therefore the described issue is a proper behavior.
In general, it is enough to add transform property: -webkit-transform: rotate(90deg); only. All other settings you can change in Themler. But I see that you add transform with -webkit- prefix only. It is not enough for all browsers. If you want to use prefixes you need to use all prefixes and one line without prefix. For example:
-moz-transform: rotate(15deg); /* for Firefox */
-ms-transform: rotate(15deg); /* for IE */
-webkit-transform: rotate(15deg); /* for Safari, Chrome, iOS */
-o-transform: rotate(15deg); /* for Opera */
transform: rotate(15deg);

Thank you,
Olivia

Hi, Unfortunately, there is no rotate option for Slider indicators depending on the position. Therefore the described issue is a proper behavior. In general, it is enough to add transform property: ` -webkit-transform: rotate(90deg);` only. All other settings you can change in Themler. But I see that you add transform with `-webkit-` prefix only. It is not enough for all browsers. If you want to use prefixes you need to use all prefixes and one line without prefix. For example: ` -moz-transform: rotate(15deg); /* for Firefox */ -ms-transform: rotate(15deg); /* for IE */ -webkit-transform: rotate(15deg); /* for Safari, Chrome, iOS */ -o-transform: rotate(15deg); /* for Opera */ transform: rotate(15deg);` Thank you, Olivia
Web IT Solutions LLP
301 Posts
Web IT Solutions LLP posted this 2 weeks ago

Dear Olivia,

Thank you so much, appreciate your support.

Can we hide slider indicator in Mobile Version. I like to show indicators only Desktop but not in Mobiles. Can we make it possible using your above css script ?

Please let us know this final query ;-)

Regards
Suffian Ahmed

Dear Olivia, Thank you so much, appreciate your support. Can we hide slider indicator in Mobile Version. I like to show indicators only Desktop but not in Mobiles. Can we make it possible using your above css script ? Please let us know this final query ;-) Regards Suffian Ahmed
Support Team
Support Team posted this 2 weeks ago

Hi,

Yes, but you need css media query. For example:

@media (max-width: 992px)
{
.bd-indicators-2
{
display: none;
}
}

This code will hide the indicators on the screens with a size less than 992px (991px and below).

Thank you,
Olivia

Hi, Yes, but you need css media query. For example: `@media (max-width: 992px) { .bd-indicators-2 { display: none; } }` This code will hide the indicators on the screens with a size less than 992px (991px and below). Thank you, Olivia
You must log in or register to leave comments