Jquery ui widgets

Where can I find some videos on using the jquery widgets that are in dreamweaver. I want to see what the possibilities are. I am not sure if I can download more plugins to give me more options within dreamweaver or if i need to download stuff that I do independent of dreamweaver and then insert it it. So any way to point me in the right direction would be great. I am also interested in the different effects that jquery offers. thanks

You'll find everything on the jQuery UI Site:
http://jqueryui.com/demos/
There are countless other jQuery plugins available on the web by 3rd party developers.
http://alt-web.blogspot.com/2012/11/primer-for-using-jquery-plug-ins.html
And you can write your own:
https://tutsplus.com/course/30-days-to-learn-jquery/
Nancy O.

Similar Messages

JQuery UI Widget trying to insert into DW

Hello, I have just been trying for a long time to insert a new (jQuery) "tabs" widget into my DW CS6 via the import widget button, but DW will absolutely not let me.
THE ERROR MESSAGE BELOW IN THE WIDGET BROWSER:
There was an error importing the widget:
The file:///C:/Users/sara/Desktop/jquery-ui-1.11.0.custom.zip could not be unzipped. Make sure that this file is a valid Open Ajax Widget packaged by the Adobe Dreamweaver Widget Browser
Last year before all the updates (in CS6) I was able to insert a tabs widget from jQuery just fine, but now, so many problems!. When I select the widget .zip file to load I get the above error and after reading others messages i'm pretty sure its not jQuery, but DW who have disabled things to try and make me upgrade to CC. If this is the case how can I back roll to previous updates of dreamweaver?
@I am using http://jqueryui.com/themeroller/ and have made a custom themed Tabs widget
Is there another way round this, i.e can I drop the .zip file wherever the widgets folder is location etc or has anyone found another way around the DW restrictions?
thanks
Sara

Hi Nancy, if Adobe has completely pulled the plug on the widget browser, then how do I now insert / load the widgets from the jQuery website? - I tried for a day, but cannot find a way.
The direct link you gave is what I am already trying to insert into DW (see my original message), to insert the tabs from jquery, you have to go to the theme roller to download it. (.zip file). How do I now get it on my .PHP page without the load widget that DW has disabled?
I have paid a lot of money for this software and really don't think its fair that an update can disable important things like this without warning. Is there somewhere where I can maybe download the widget installer, i.e the one I already paid for when I bought CS6 DW?

Anyone know about using Telerik jQuery UI widgets with DW-CC? (or will I always have to use them programatically) Thanks.

Tekerik has a great set of jQuery ui widgets (Kendo UI) but it gets complicated always using them programatically. Any suggestions?

Hi, I suppose you will get more professional and quicker help at Telerik Developer Forums.

Support for menu jQuery UI widgets in DW CC2014

Does DW CC 2014 have menu included in the supported jQuery UI widgets?
I saw Preran's response to a similar question posted on Jul 24, 2013, saying that Adobe definitely has a plan to integrate jQuery menu widget into Dreamweaver. Now we are at Oct 7, 2014, how is the situation now? I'm using DW CC 2014 (2014.0 release, 6733 Build), apparently it still has no support for jQuery menu.
Please help!

To be honest, the menus you can use are endless. A Google search will reveal many more.
Project Seven has a fine line of commercial products and DW Extensions.
http://www.projectseven.com/
Responsive Iconic
http://www.dynamicdrive.com/style/csslibrary/item/responsive_iconic_menu/
Responsive Hybrid
http://www.dynamicdrive.com/dynamicindex1/responsivehybridmenu/index.html
jQuery Superfish
http://users.tpg.com.au/j_birch/plugins/superfish/
jQuery MeanMenu (responsive on mobile)
http://www.meanthemes.com/plugins/meanmenu/
jQuery MegaMenu 2
http://www.geektantra.com/2010/05/jquery-megamenu-2/
Nancy O.

DW 6.1 widget browser? if spry is gone, why don't i have a jquery UI widget browser?

DW 6.1 (eLearning suite) on Windows7. My insert menu has a spry widget browser but I cannot add widgets to it. I also cannot see where I can add the jQuery widget browser that I see discussed elsewhere. Please help ... I need a pagination widget (backward, forward) and a couple of others ... that is DW-compatible and works with IE8. Thanks!

You're absolutely correct, Nancy O. about the version. I have happily found the Spry insert stuff and have implemented it in a tabbed menu and vertical navigation. Thanks, also for clarifying "plug-ins" as opposed to "widgets".
I was hoping for Adobe-blessed "thingiemabobs" and "doohickies" to show pagination, forward/backward, and so on to minimize integration pain with DreamWeaver's CourseBuilder extension, which is a non-negotiable part of the eLearning Demo I must create.
What I was hoping to find was the answer to "how do I get jQuery UI onto my insert menu?" I see demos where it appears just below the Spry entry, but it seems as though it's only for "CC."
Thanks for your reply. If you have guidance about getting the jQuery UI on the insert, I'd be grateful.
Regards,
ETS

Feature Request: Full JQuery UI widgets library

Adobe Muse currently contains widgets such as Accordion or ToolTip.
However it lacks very handful Query UI widgets.
I'm trying to put this Slider | jQuery UI on my page using embeded html options but without success.
If anyone had the same problem and could show me the way i will be glad.
Regards,
Jakub Jedynak

I don't have a solution for you, but this sounds like the perfect idea for a widget to build, then sell, in the exchange. I imagine it wouldn't be all that difficult to find a contract developer to help you out for a rather reasonable price. (Clarification: I am definitely not a developer)

How to change the individual width of a tab in a jquery tab widget?

I have a jquery tab like this:
But the default width for the tabs is too short for some of the tabs with longer names, causing this to happen:
Was just wondering how I could fix this?

Preview your page in a Browser like Chrome, Firefox or Safari. Use Right click > Inspect Element. Drill down to the Tab and see which selector contains a width property. It may be JavaScript driven so also examine the HTML source code for any inline styles.
Nancy O.

JQuery Accordian widget downloaded into DW

I downloaded an accordian that is perfect except I have live links inside of it and I would like to change them to blue to be more intuitive for the average user. Can I change the color of the content selectively inside a themed accordian? I don't really want to start from scratch building my own theme in JQuery ui.
file://macintosh%20hd/Users/faithmurray/Desktop/tensorwebsite/awards.html
Would appreciate help.
Thank you.

Hi Ken,
Unfortunately I still can't get this to work. I went into the styles panel and found the rule that you referenced but although it appears lit up like you can change it, ie; it will delete.... it then bounces back to the original. I also got this error message:
Then although I see the jquery-ui.css as a related file on the document tool bar that specific file does not show up in the files panel to download from the remote server as the error message says to do.
The original file has this at the top.
Is it possible that they don't allow for any edits of the themed accordians?
Thanks again for your help.
Faith

Roll Your Own - APEX 4.0 and JQuery-UI Application

For those with a apex.oracle.com account and want to see jQeury tabs running via 4.0 in your own Workspace, use following this script to create your own version of Shijesh's (Apex_Noob) application.
Credit also goes out to Alistair Laing for his hard work in investigating why 4.0 is requiring the use of the googleapis jquery.js... libraries.
Application Builder - Create
Application Type - Database
Create Application - From Scratch
Name - jQuery Application
Add Page - keep default and Click Add Page
Click CreateMy application defaulted to Theme 2, you will need to switch the theme to one of the following: If you don't the tabs will not render properly.
8 Orange
10 Sand
13 Classic Blue
14 Simple Green
15 Light Blue
16 Dark Blue
18 Simple Gray
19 Red Gray
Message - Application created successfully.
Click Shared ComponentsUnder User Interface Click - ThemesIf you don't see one of the above Themes, you will need to Create and switch your Theme.
Click - CreateFrom the Repository selected Click - Next and select one of the above Themes
Click - Switch ThemeSelect one of the above Themes and Click - Next
Click -NextClick - Switch ThemeReturn to your newly created Application by Clicking on Application xxxxxxx Breadcrumb
Click - Create PageSelect - Blank PageClick - NextAssign the page a name
Click - NextAccept defaults and Click - NextClick - FinishClick - Edit PageI still work in Component View, to toggle to this View, click on the control adjacent to Page number and Go button. Hover over the ones on the far right and you will see both Component View and Tree View
From Component View
Click on the Page Edit Control
In the Text Area labeled Javascript/Execute when Page Loads - paste in the following code:
$x("tabs").appendChild( $x("tabs-1"));
$x("tabs").appendChild( $x("tabs-2"));
jQuery("#tabs").tabs();In the Text Area labeled HTML Header and Body Attribute/HTML Header - paste in the following code:
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/redmond/jquery-ui.css" type="text/css" />
<script src= "http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.js"> </script>Click - Apply ChangesRequired use of the Google jqueryui libraries is being questioned by recent threads created by Alistair Laing since it appears that 4.0 does not currently support jQeury tabs
{thread:id=1083507}
{thread:id=1083540}
Create a Region
Type HTML Text - accept defaults
Provide a Title like "Tabs" and accept defaults
Template - Reports Region
Sequence 10
Click - NextIn the Enter HTML Text Region Source: Text Area - paste in the following code:
<div id="tabs">
<ul>
<li><a href="#tabs-1">Employees</a></li>
<li><a href="#tabs-2">Departments</a></li>
</ul>
</div>Click - Create RegionCreate a second Region
Type Report/Sql Report
Provide a Title like "Employees" and accept defaults
Template Reports Region
Sequence 20
Click - NextIn the Enter SQL Query or PL/SQL function returning a SQL Query: Text Area - paste in the following code:
SELECT empno,
       ename,
       job,
       mgr,
       hiredate,
       sal,
       comm,
       deptno
FROM   empClick - Create RegionEdit the newly created Report Region
Under Attributes/Static ID - paste in the following code:
tabs-1Click - Apply ChangesCreate a third Region
Type Report/Sql Report
Provide a Title like "Departments" and accept defaults
Template Reports Region
Sequence 30
Click - NextIn the Enter SQL Query or PL/SQL function returning a SQL Query: Text Area - paste in the following code:
SELECT deptno,
       dname,
       loc
FROM   deptClick - Create RegionEdit the newly created Report Region
Under Attributes/Static ID - paste in the following code:
tabs-2Click - Apply ChangesRun you page and you should see you tabs.
Jeff

Great post Jeff,
With regard to Jquery UI and tabs I've contacted the Apex dev team and received a reply from them.
All the jQueryUI files are included in the APEX 4.0 distribution, but not all jQueryUI components
are loaded by default to avoid a huge initial download. It's not necessary to load your own version of jQueryUI, just load the missing component.
For the "Tabs" you have to add
<link href="IMAGE_PREFIX#libraries/jquery-ui/1.8/themes/base/jquery.ui.tabs.css" rel="stylesheet" type="text/css" />
<script src="#IMAGE_PREFIX#libraries/jquery-ui/1.8/ui/minified/jquery.ui.tabs.min.js" type="text/javascript"></script>
to your page template or the header attribute of your page where you want to use it.They did not mention which other Jquery UI widgets were not included so people need to check to see if they get any JS errors Like "$('#tabs').tabs() is not a function" this would suggest that tabs is not being loaded. To included it in you page header directly after #HEAD# you need to place the css and js as stated above.
If you need jquery help just post you queries here or the is some other jquery links that maybe of some use
jQuery
http://jquery.com/ - Official jQuery Website
http://api.jquery.com/ - jQuery API Library
http://plugins.jquery.com/ - jQuery Plugins (Not APEX related)|
http://yayquery.com/ - yayQuery - jQuery Podcast
http://jqueryui.com/ - Official jQuery UI Website
http://jqueryui.com/demos/ - jQuery UI Demos
Edited by: Alistair Laing on Jun 9, 2010 4:04 PM
Add more links
Edited by: Alistair Laing on Jun 9, 2010 4:09 PM

CS4 Error when using Jquery UI Calender

Hi - hope this is the correct forum to post on this query -
I've just upgraded to DW - CS4 and started to play with some of the
new widgets - I already have a page to which I applied the JQuery
UI Calender widget which is neater than the datepicker I was using.
This page has a number of dbase bindings to get data from several
tables - all these are functional IF i don't modify them. However
if I attempt to make a change which I did for the DW insert record
behavior when I select 'connection' to choose the database this
error message occurs:
While executing onChange in InsertRecord.htm, the following
JavaScript error(s) occurred:
At line 665 of the file "C:\program files\ . . .
\ServerBehaviors\PHP_MySQL\InsertRecord.js": name has no properties
As far as I can see this occurs on insert & update DW
record behaviours (edit - on a page) where I have the JQuery widget
applied. If I remove the widget it works fine (which is what I have
done) I was wondering if anyone else has noticed this ??

AmiBios wrote:
> David - Many thanks for taking time to reply - I've
tried that option with no
> success along with a few other such as recretaing the
site cache - It certainly
> does appear to be a conflict between the JQuery
'calendar widget' and the DW
> insert behavior. I've tried a few other widgets and all
works well. I suppose
> i'll just leave the widget out as the insert is just a
wee bit more important
Ah, reading your original post more carefully, I see what's
happening.
The type of JavaScript error you mention is normally caused
by a corrupt
cache file, but it seems as though it's happening only when
you try to
edit an insert record server behavior.
Without setting up a similar page myself, I can't confirm
whether this
is reproducible. My advice would be to apply the widget after
you have
finished editing the server behavior. In theory, there
shouldn't be any
conflict between a jQuery widget and the server behaviors,
but that's
the type of thing that comes out only after thorough testing.
It might be a good idea to submit a bug report to Adobe:
http://www.adobe.com/cfusion/mmform/index.cfm?name=wishform
David Powers, Adobe Community Expert
Author, "The Essential Guide to Dreamweaver CS3" (friends of
ED)
Author, "PHP Solutions" (friends of ED)
http://foundationphp.com/

Embedding Html code or widgets within Adobe Edge Animate project

Hi There,
I have just discovered Edge and i think it is amazing finally the "new" web standards are being put in the designers hands again!!
My question is this i have designed an online web based application using the amazing features in edge, what i need to do now is for instance add a weather widget or a news feed, how do i get this to work in edge, i have read about using iframes to embed video but this approach doesnt work for me, i would love to use this software for all of our web based projects but i need to know if its possible to embed html
If anyone out there can point me to some literature or an example of how this is done i would be so grateful! seriously love this software!
Thanks in advance!

Hi again Darrell,,
Thanks for the reply, At the moment if i could get hello world to show within a div in edge i would jump for joy! . Im starting to wonder if there is something wrong with my procedure, correct me if im wrong here..
Open edge, create new project, draw out rectangle, convert to symbol, name symbol widgetContainer, open up stage properties and set overflow to auto, open up code editor and under composition ready event add "sym.$("widgetContainer").load('html/helloworld.html');" Is this the right process?
What i need to do i either pull an iframe of an existing webpage onto the div whitin my project or get a jquery standalone project to display within the div either will work for me as long as i have the ability to update the information seamlessly, the exact widget im using is called WeatherSlider Premium jQuery Weather Widget. To be honest i would love to just pull an iframe of the site i would like displayed in the div that would be perfect..
Thank you again for taking the time to listen and reply to this, Adobe community for the win! I was mortified when flash got pushed out the market so i am really happy that we are back in the game with awesome tools again So excited to be learning again
Thank you again hope my rambling has made sense

How to include jquery plugin in sap

I want to include a jquery plugin in sap view .how to do it?
Plz explain with an example if possible.
Thanks in advance

You can do this at the top of your view/controller to include jQuery UI plugins.
jQuery.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-core');
jQuery.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-widget');
jQuery.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-mouse');
jQuery.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-draggable');
jQuery.sap.require('sap.ui.thirdparty.jqueryui.jquery-ui-sortable');
Regards
Sakthivel

Why do my Jquery functions stop working when adding an Edge animation to my page?

I've used Edge now for a few months on several projects and it's very useful for a designer like myself to create html5 animations as quick as Flash, but I'm noticing that everytime you add edge to a page, the jqeury it uses overwrites any others on the page and breaks other jquery based widgets. Why is this?
I've had a coder friend I work with have a look at the problem and his only solution was to put the edge animation inside an iframe, which is far from ideal.
Is there a way to use Edge and still use other jquery widgets on the page? (Basically I'm using a Nivo Slider jquery fading image box further down the page, which is breaking).
Thanks

martcol wrote:
> I really do not thing that I have done anything at all
to the
> page and can garantee no changes to the PHP script.
>
> It's hosted on some free space so there's no support
there. What might be the
> problem?
With free hosting, you get what you pay for - nothing. It's
possible
that the hosting company has changed the PHP configuration
and turned
off the display of errors. Most companies do so nowadays,
because the
display of errors is considered a security risk.
You can try adding this to the top of the PHP script:
<?php ini_set('display_errors', '1'); ?>
If that displays any error messages, post the details of the
error
message here, and someone should be able to help you.
However, without giving more details of the script and setup,
your
question is rather like saying "My car won't start. What's
wrong?" It
could be anything. To get decent help online, you need to
describe the
problem in more detail.
David Powers, Adobe Community Expert
Author, "The Essential Guide to Dreamweaver CS4",
"PHP Solutions" & "PHP Object-Oriented Solutions"
http://foundationphp.com/

Why is zoom widget not working across all browsers? How get answer?

We placed the jquery zoom widget on the following page: http://www.hoohobbers.com/baby_crib_bedding_ahoy!zoom.html
It works as advertised in IE and FF. It doesn't do a thing in Opera, and in Safari it loads in a different position than that specified in code, and is 'stuck' in only being able to zoom the top layer of images; the zoom will not move freely around the entire image.
Does anyone know what the problem is?
Also, does anyone know of other 'forums' where an answer might be sought? After our initial posting -and responses- as to how to get the widget to work in the first place, we posted this latest problem over 24 hours ago but not received a reply.
Thanks in advance for any help or direction.

OK this is not a server-side issue.
Again, it's browser-based. Your code needs to be:
<embed src="[filename].mp3" type="application/x-mplayer2" autostart="false" playcount="true" loop="false">
This will make Internet Exploder use Windows Media Player to play back the .mp3 file
The type attribute overrides the actual file extension and MIME type of the file to be played.Unfortunately, IE ignores MIME Types and file extensions - instead it examines the contents of the file and decides for itself what format it is and what to do with it. IE will use WMP to play a media file unless another browser plugin lists it.

New css for jquery ui tabs

I would like to be able to change the css on my jquery tabs widget on one page without it effecting the css for my tab panels on other pages. right now when i change it on one page it changes it on the other and that is not what i want to do... thanks
avery

Open your Template.dwt file and make sure there is an editable region for the <head> tag. It should look like this:


</head>
Save template and populate changes to child pages. Now you can insert scripts and links to external CSS files into your child pages.
Nancy O.

Jquery ui widgets

Similar Messages

Maybe you are looking for