JsFiddle code not working - jsfiddle

I have a better question following up but this is too basic. Is there some problem with my code(syntax) or Is it Jsfiddle which is not working well!
Link :http://jsfiddle.net/HEM7Q/
here is the jquery code:
$(document).ready(function () {
$(".button").click(function(e) {
$(this).slideUp(2000)
});
});
I simply wanna hide the div which has the class "button" when I click on it.
Help appreciated!
Thanks

Select jQuery library from left side of site in section Frameworks & Extensions

You did not include jQuery library in your code.
Check out the update; http://jsfiddle.net/HEM7Q/3/
Include jQuery library

Related

Testcafe - Selecting an element in Shadowroot is not working

I have this website https://www.storytel.com/sg/en/where I am trying to click on the button (refer to the image) in the Subscription Component which resides in the Shadowroot. I have tried with the following codes but it didn't work. It will be great if someone can help. Thanks in advance.
test('Click inside shadowDOM', async t => {
const shadowBtn = Selector(() => document.querySelector('storytel-subscription').shadowRoot.querySelectorAll('*[data-testid="subscription-card-0-button"]'));
await t
.click(shadowBtn);
});
There seems to be a bug with processing elements in shadow dom. I suggest you create an issue in the TestCafe GitHub repository and describe your scenario there: https://github.com/DevExpress/testcafe/issues/new?template=bug-report.md

AutoCAD Lisp hook up help function to show Youtube video

I'm having trouble hooking up the F1 help function in AutoCAD Lisp with a custom Youtube video instead of showing the default AutoCAD Help files. I've found this article to be quite helpful, but it won't allow me to supply a youtube video in any way.
The custom AutoCAD browser is too old and does not support HTML5 (which is needed to run Youtube videos). Any help on how to solve my issue?
Case: How to bind the F1 help to a custom function in AutoCAD Lisp, then activate a Youtube clip on F1 keypress.
After a while, I got it all figured out. I had to use a combination of HTML/Javascript to trigger the default web browser (which hopefully supports HTML5), and then view the Youtube clip there:
Lisp:
(setfunhelp "C:MyFunction" "C:\\path\\to\\html\\file\\MyFunc_Help.html")
(defun C:MyFunction ()
(alert "this is my function")
)
HTML:
<html>
<body>
<script>
function OpenInNewTab(url, callback) {
var acWindow = window.open("", "_self");
acWindow.document.write("");
setTimeout (function() {acWindow.close();},500);
var newWindow = window.open(url, '_blank');
newWindow.focus();
}
OpenInNewTab("https://youtu.be/FERNTAh5s0I");
</script>
</body>
</html>
This HTML code opens a new browser window in your default browser, then closes the AutoCAD default browser after 500 milliseconds.
I hope this will be of help to someone.

dojo 1.8: create widget and startup upon dojo/on

Hi I am looking for tutorial based on Dojo 1.8.
What I am looking for is:- create and instantiate widget pragmatically after dojo page fully loaded and parsed, triggered after dojo/on button. I am not sure of which tutorial in Dojo website, for me to learn.
Please advise.
Thanks in advance.
Clement
There isn't one tutorial that fully answer all your question but the following will be helpful:
Dojo Events tutorial and dojo/on reference
dojo/ready reference
dojo/parser reference
To capture both the full loading of the page and parsing you need to use a combination of dojo/ready and dojo/parser. (I'm assuming that the parsing you refer to is the dojo widget parser, rather than the standard browser parsing of HTML).
To run code after parsing you'll need to add parseOnLoad: false to your dojoConfig and run the parser manually; otherwise, there is no way of capturing when it is complete.
<script type="text/javascript" async="true">
require([
"dojo/ready",
"dojo/parser",
"dojo/on,
"dojo/query"
], function(
ready, parser, on, $
){
ready(function(){
// Only run after the page is fully loaded
parser.parse().then(function(instances){
// Only run after parser has parsed the page
var myButton = $("#myButtonid"); // Find your button
if(myButton.length > 0){ // Check button is found
on(myButton[0], "click", function(evt){
// ... add your code here to create and
// instantiate widget
});
}
});
});
}
</script>
Don't forget that you need to turn off automatic parsing of widgets in you dojoConfig, hence, something like this (in the head):
<script type="text/javascript">
dojoConfig= {
"parseOnLoad": false,
"async": true
// ...other settings
};
</script>

Drag and Drop of file upload in DOJO

Is there an option in DOJO where files can be uploaded by Drag and Drop from desktop to the browser?
No I dont believe so. As outlined here and here its not really possible to do without using a plugin.
Old post, but still one of those posts being found by google easily. For those interested how to do this:
Have a look at this SO answer
Dojo overview of how to use its Uploader (styled as a button)
Use addDropTarget to link a dropArea for that uploader (for HTML5-enabled browsers -- see also first link))
To make the drop target visibly react to drag events, I had to connect directly to browser events like ondragenter or ondragleave (see code snippet below)
createUploader: function() {
// ... define uploader and droptarget
d_on(this.dropArea, "dragover", d_lang.hitch(this, this.dropAreaOver));
d_on(this.dropArea, "dragleave", d_lang.hitch(this, this.dropAreaLeave));
d_on(this.dropArea, "drop", d_lang.hitch(this, this.dropAreaLeave));
}
dropAreaOver: function(evt) {
evt.preventDefault();
domClass.add(this.dropArea, "dropAreaOver");
},
dropAreaLeave: function(evt) {
evt.preventDefault();
domClass.remove(this.dropArea, "dropAreaOver");
}

Flowplayer in jQuery UI tabs in IE keeps playing video in inactive tab

I have been working on a mediaplayer with playlist using flowplayer in combination with jQuery tabs. But I run into issues with IE where when I switch tabs it still keeps playing the video in the closed tab. This does not happen in firefox or chrome, only in IE.
You can checkout my demo here
I was browsing the flowplayer forums and someone posted a solution, but the persons solution was not using jQuery UI, instead he was using jQuery Tools. So I am trying to figure out how to implement it in jQuery UI. I did not get any help from the flowplayer forums, so I thought I'd try in here.
This is the code the person used to supposedly solve the issue in jQuery Tools (forum post) I tried this using jQuery Tools and it didn't work completely.
incomplete jQuery Tools solution:
$(function() {
var api = $(".items").tabs(".tabs-cont").data("tabs");
api.onClick(function(index) {
var video = api.getCurrentPane().find("div.video"),
videoCont = video.find("div.video-cont");
videoCont.detach();
video.append(videoCont);
});
});
html:
<div class='video'>
<div class="video-cont"><object>FLASH EMED HERE</object></div>
</div>
I was able to figure something out on my own. Don't know if there is a better way of doing it, but it did solve my problem.
$( "#tabs" ).tabs({
show: function(e, ui) {
$.cookie( "tab-name", ui.panel.id );
},
select: function (e, ui) {
var tab = "#" + $.cookie ( "tab-name");
var video = $( tab ).find("div.media-container"),
flow = video.find("div.flow-container").attr('id');
$f(flow).stop();
}
});