Response title
This is preview!
- Screen name: tauren
tauren's Profile
4 Posts
7 Responses
0
Followers
Activity Trend
Last 30 days
Loading Chart...
Show:
- Expanded view
- List view
- 19-Mar-2010 02:27 PM
- Forum: Using jQuery UI
I posted this question on StackOverflow but am not getting much of a response. Hopefully someone here will have some suggestions.
Basically, I want to customize jquery-ui-tabs so that they work like HootSuite's tabs:- excess tabs that won't fit onto the screen will get added to a "More" dropdown list tab at the end of the tabs
- an add button (small plus sign) is displayed right after the last tab (just to the right of it, but in the same horizontal row)
- tabs in the drop-down "More" list can be dragged into the tab bar
Anyone know of any plugins that do this? The Paging Tabs plugin is the closest I've found. I have some ideas on how to accomplish it, but if it's already been done I like to leverage that. Any ideas or techniques to accomplish this are appreciated!
Thanks,
Tauren- 07-Dec-2009 02:24 PM
- Forum: Using jQuery UI
<div>I need to build a feature for an application that allows users to design things like business cards via a simple drag-n-drop interface. This means at a minimum, being able to add text fields, lines, and images to an area on the page. I'm envisioning features such as "show grid", "background image", "background color", etc.</div>
<div>
</div><div>Does anyone know of anything similar? I've been searching and can't locate anything. It doesn't even have to be specific to this -- it could be a floor plan designer, a powerpoint-like layout tool, a report builder, etc.</div>
<div>
</div><div>I fully expect to have to build this myself, probably with UI components like drag, drop, resize, dialog, etc. But I am interested to look at what else is out there that might be similar.</div><div>
</div><div>Also, I've been looking into both HTML5 canvas and SVG (using Raphael) as part of this. Any thoughts on using these?</div><div>
</div><div>Thanks!</div>--
I sent this question earlier, but it never showed up on the list that
I could tell. Sorry if its a duplicate.
Can someone tell me if I change the handle on a resizable to be just
's', if I should actually see a handle on the south side of the div?
Everything works properly when I do this -- the mouse cursor changes
to an up/down arrow, I can resize the div only up/down from the bottom
edge, etc. The SW handle image goes away, which makes sense. But
there is no visual icon or handle added to the bottom of the div. Is
this the way it works?
I've downloaded jquery yesterday with all components and the "start"
theme in it. Then I copied the resizable sample, and just changed it
to use handles: 's'. See sample code below.
Thanks!
Tauren
<html>
<head>
<link type="text/css" href="jquery-ui-1.7.1/css/start/jquery-
ui-1.7.1.custom.css" rel="stylesheet" />
<script type="text/javascript" src="jquery-ui-1.7.1/js/
jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.7.1/js/jquery-
ui-1.7.1.custom.min.js"></script>
<style type="text/css">
#resizable { width: 150px; height: 150px; padding: 0.5em; }
#resizable h3 { text-align: center; margin: 0; }
.ui-resizable-helper { border: 1px dotted gray; }
</style>
<script type="text/javascript">
$(function() {
$("#resizable").resizable({
animate: true,
handles: 's'
});
});
</script>
</head>
<body>
<div class="demo">
<div id="resizable" class="ui-widget-content">
<h3 class="ui-widget-header">Animate</h3>
</div>
</div><!-- End demo -->
</body>
</html>- 09-May-2009 09:09 AM
- Forum: Using jQuery UI
Can someone tell me if I change the handle on a resizable to be just
's', if I should actually see a handle on the south side of the div?
Everything works properly when I do this -- the mouse cursor changes
to an up/down arrow, I can resize the div only up/down from the bottom
edge, etc. The SW handle image goes away, which makes sense. But
there is no visual icon or handle added to the bottom of the div. Is
this the way it works?
I've downloaded jquery yesterday with all components and the "start"
theme in it. Then I copied the resizable sample, and just changed it
to use handles: 's'. See sample code below.
Thanks!
Tauren
<html>
<head>
<link type="text/css" href="jquery-ui-1.7.1/css/start/jquery-
ui-1.7.1.custom.css" rel="stylesheet" />
<script type="text/javascript" src="jquery-ui-1.7.1/js/
jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.7.1/js/jquery-
ui-1.7.1.custom.min.js"></script>
<style type="text/css">
#resizable { width: 150px; height: 150px; padding: 0.5em; }
#resizable h3 { text-align: center; margin: 0; }
.ui-resizable-helper { border: 1px dotted gray; }
</style>
<script type="text/javascript">
$(function() {
$("#resizable").resizable({
animate: true,
handles: 's'
});
});
</script>
</head>
<body>
<div class="demo">
<div id="resizable" class="ui-widget-content">
<h3 class="ui-widget-header">Animate</h3>
</div>
</div><!-- End demo -->
</body>
</html>
© 2010 The jQuery Project
Sponsored by 
and others.