I have an Owl Carousel question that I couldn't find any answer to.
Once I change the transitionStyle,
like: owl.data('owlCarousel').reinit({transitionStyle:'backSlide'});
How can I return it to the default (right to left) slider ?
Thanks
Could find the answer only after digging into "owl.carousel.js".
Here it is:
owl.data('owlCarousel').reinit({transitionStyle:false});
Related
I am trying to check whether a checkbox is selected. My checkbox is styled using input and span, not using the checkbox tag. As it's not a default checkbox I can't use methods such as isSelected or isChecked to check its state. I was then trying to check if any class belongs to a state but not the other. However, the only difference I've found so far is that when the element is selected an ::after appears but not sure how to go about checking this?
I found a tutorial with a similar issue, but don't know much about Javascript and not sure how to adapt it to my case.
https://www.quora.com/How-do-I-locate-After-and-Before-css-tag-in-selenium-webdriver
Before clicked
After clicked
That's what is being used and as per #pguardiario answer
System.out.println(js.executeScript("return window.getComputedStyle(document.querySelector('.custom-checkmark'), ':after').getPropertyValue('content')"));
But both when it's selected or not it returns the same output (empty string)
UPDATE
Found the difference between the selected and unselected states. The .custom-checkmark:after style has display-none when the checkbox is not selected.
Not sure still how to use this info as that's what I have at moment and they return display none both before and after the checkbox is clicked.
#Test
public void testingCheckbox() {
JavascriptExecutor js = (JavascriptExecutor) wd;
System.out.println(js.executeScript("return window.getComputedStyle(document.querySelector('.custom-checkmark'), ':after').getPropertyValue('display')"));
lp.clickCheckBox();
System.out.println(js.executeScript("return window.getComputedStyle(document.querySelector('.custom-checkmark'), ':after').getPropertyValue('display')"));
}
NEW FINDING
It seems there's actually 'two checkboxes'. One with the span tag and the other one with the span. They appear together when unselecting some attributes.
Thanks for the help.
I can't test it but it should look something like this:
driver.executeScript('return window.getComputedStyle(document.querySelector(".custom-checkmark"), ":after").getPropertyValue("content")')
Sorry about the long line btw, Java doesn't have heredocs which makes this painful :(
Try use JavascriptExecutor, import them :
import org.openqa.selenium.JavascriptExecutor;
Try this :
WebElement chk = driver.findElement(By.xpath("//*[#class='custom-checkmark' and ./preceding-sibling::*[#id='terms_checkbox']]"));//or you have
String getPro;
getPro = ((JavascriptExecutor)driver).executeScript("return window.getComputedStyle(arguments[0], ':after').getPropertyValue('background-color');",chk).toString();
System.out.println(getPro);
chk.click();
Thread.sleep(1000);
getPro = ((JavascriptExecutor)driver).executeScript("return window.getComputedStyle(arguments[0], ':after').getPropertyValue('background-color');",chk).toString();
System.out.println(getPro);
Not sure with .getPropertyValue('background-color'), but this may be a clue.
Try the below CSS selectors for identifying that
span.custom-checkmark:after
And also please see the below link for more details
Extracting content in :after using XPath
Got the code to work. Targeting the input tag instead of span solved the problem. I had a mistake on my code when tried that first time so that's why though the isSelected field wasn't working and moved on to target the span tag instead which opened this thread here. Sorry about that and thanks for everybody's help.
I try to used #shoutem/ui! In my project, I define 1 Component with header is NavigationBar of #shoutem/ui, in NavigationBar I try define rightComponent is an DropDownMenu, but when long content, navigation bar will made 2 line and I don't want that way! I'm still want it pingleline!
That's what I'm facing:
Please Help.
It seems that this PR https://github.com/shoutem/ui/pull/216/files solves it, so please check if you are using the latest version of #shoutem/ui.
Does anyone have any experience with using a url to target a specific slide in a Soliloquy slider? I am using multiple sliders that I need to link to specific slides of from external pages/sites. The Soliloquy Docs provide this info (soliloquywp.com/docs/dynamically-set-the-starting-slide/) as closest to the solution but, for a php noob like me, the explanation is a bit terse and lacking, my fault, not theirs.
The example given in the docs seems to be a custom filter for a specific slide in a specific slider. I need to target slides in multiple sliders with urls. I guess I need help understanding the filter's function. I have commented out what I think each part does. Maybe someone could show me where I'm wrong?
//OP: I don't understand, what ids/slides are represented by the 10 and 2 values in these parameters. Where do I find these?
add_filter( 'soliloquy_pre_data', 'tgm_soliloquy_dynamic_starting_slide', 10, 2 );
function tgm_soliloquy_dynamic_starting_slide( $data, $slider_id ) {
// If the proper $_GET parameter is not set or is not the proper slider ID, do nothing.
//OP: Is the 'sol_slide' parameter for ALL soliloquy sliders in my site or is it the name in the Dashboard given when constructing the slider?
if ( empty( $_GET['sol_slide'] ) ) {
return $data;
}
// Change this if you want to target a specific slider ID, or remove altogether if you want this for all sliders.
//OP: I believe to target ALL sliders in my site I should comment this out. Right?
if ( 51064 !== $slider_id ) {
return $data;
}
// Set the slide number as a config property. Also preventing randomizing slides.
$data['config']['start'] = absint( $_GET['sol_slide'] );
$data['config']['random'] = 0;
// Optionally prevent autostarting the slider. Uncomment if you want that.
//$data['config']['auto'] = 0;
return $data;
}
Basically, I guess I am asking for a little help with implementing this filter to target any slide in any slider with a url. Slim odds, but I'm dead in the water! Big thanks to anyone who can shed some light on this for me.
Complete, correctly functioning answer is here provided the plugin author, of course, duh: http://soliloquywp.com/support/topic/a-way-to-link-directly-to-a-specific-slide/
The value "sol_slide" is generic to any slider created with the plugin. Just put the custom filter provided in the example into your, hopefully, child-theme's functions.php, and construct your urls targeting specific slides like so: http://mywebsite.com/specific-product-page-with-slider/?sol_slide=3. Slide numbering is based on zero so 1 = 2 etc. Works like a charm.
how to do jssor slider direction navigator with transition effects. it just slides images without any effect.
I set the transitions, but it does not work with the direction navigator.
For dragging (I suppose will also work for arrows navigation) you should use this option
$SlideEasing: $JssorEasing$.$EaseOutQuint
Instead of $EaseOutQuint you can use one of these (list below) - jssor documentation lacks on this, so I had to extract manually from .js ... enjoy trying different effects :D
$EaseLinear
$EaseGoBack
$EaseSwing
$EaseInQuad
$EaseOutQuad
$EaseInOutQuad
$EaseInCubic
$EaseOutCubic
$EaseInOutCubic
$EaseInQuart
$EaseOutQuart
$EaseInOutQuart
$EaseInQuint
$EaseOutQuint
$EaseInOutQuint
$EaseInSine
$EaseOutSine
$EaseInOutSine
$EaseInExpo
$EaseOutExpo
$EaseInOutExpo
$EaseInCirc
$EaseOutCirc
$EaseInOutCirc
$EaseInElastic
$EaseOutElastic
$EaseInOutElastic
$EaseInBack
$EaseOutBack
$EaseInOutBack
$EaseInBounce
$EaseOutBounce
$EaseOutBounce
$EaseInOutBounce
$EaseInBounce
$EaseOutBounce
$EaseInWave
$EaseOutWave
$EaseOutJump
$EaseInJump
P.S. Dragging works, let me know if also arrow navigation is ok
Is there a way to change the title of the tab I have a title of 'Library' set but I still see bookmarks as the title can someone explain why this doesn't work or better yet how to fix it.
try tab.setTitle('Library');
demo here