[jQuery] Putting a table inside a HTML drop down select box
is there any way to put table inside a HTML drop down select box -- View this message in context: http://old.nabble.com/Putting-a-table-inside-a-HTML-drop-down-select-box-tp27262269s27240p27262269.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] open drodown
I put that div on select to reduce the width not the size , right now I use
this jquery which works
$(document).ready(function(){
$('#program').wrap(div class='wrapper'/div);
$('.wrapper').after(div class='selectArrow'/);
$('.wrapper').find('select').mousedown(function(){
$(this).parent().next().addClass('selectArrow-mousedown').removeClass('selectArrow-mouseover');
}).
mouseup(function(){
$(this).parent().next().removeClass('selectArrow-mousedown').addClass('selectArrow-mouseover');
}).
hover(function(){
$(this).parent().next().addClass('selectArrow-mouseover');
}, function(){
$(this).parent().next().removeClass('selectArrow-mouseover');
});
$('.selectArrow').click(function(){
$(this).prev().find('select').focus();
});
$('.selectArrow').mousedown(function(){
$(this).addClass('selectArrow-mousedown').removeClass('selectArrow-mouseover');
}).
mouseup(function(){
$(this).removeClass('selectArrow-mousedown').addClass('selectArrow-mouseover');
}).
hover(function(){
$(this).addClass('selectArrow-mouseover');
}, function(){
$(this).removeClass('selectArrow-mouseover');
});
});
.wrapper{
display: inline;
float: left;
width: 180px;
overflow: hidden;
}
.selectArrow{
display: inline;
float: left;
width: 17px;
height: 22px;
border:1px solid #7f9db9;
border-left: none;
background: url('images/selectArrow.png') no-repeat 1px 1px;
}
.selectArrow-mousedown{background:
url('images/selectArrow-mousedown.png') no-repeat 1px 1px;}
.selectArrow-mouseover{background:
url('images/selectArrow-mouseover.png') no-repeat 1px 1px;}
this function puts the div
but if the user clicks on the selectArrow image drop down does not open ,
user has to click on the dropdown , please tell me if I can oprn the
dropdown when user clicks on the select-arrow image ?
MorningZ wrote:
If there was an API for it, it would be on the docs page (http://
docs.jquery.com), but in thinking what a select looks like when it's
open, it's easy to use some simple code to change the select's
size property (http://www.w3schools.com/TAGS/att_select_size.asp)
from 1 to # of children and back again:
(working) case in point:
http://jsbin.com/iloqa/edit
On Dec 26, 1:45 pm, fachhoch fachh...@gmail.com wrote:
My select drop down is inside a div , I am wondering if jquery has any
api
to open the dropdwon ,when user clicks on the div ?
div class=wrapper
select name=infGrantProgram id=program
wicket:id=infGrantProgram
option value= selected=selectedChoose One/option
option value=114AD - DEVELOPMENTAL DISABLITIES -
94006/option
option value=372AC - Developmental Disabilities
Councils -
93630/option
option value=771ADPTASST - Adoption Assistance -
93659/option
option value=978AE1 - Community Based Abstinence
Education -
93010/option
option value=935AEGP - Abstinence Education Grant
Program -
93235/option
option value=815ZV - ASSISTANCE FOR VICTIMS OF
TRAFFICKING -
93598/option
/select
/div
--
View this message in
context:http://old.nabble.com/open-drodown-tp26929027s27240p26929027.html
Sent from the jQuery General Discussion mailing list archive at
Nabble.com.
--
View this message in context:
http://old.nabble.com/open-drodown-tp26929027s27240p26929490.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] make table wisth adjustable
is there anything available to automatically turn my table , into adjustable width columns table ? -- View this message in context: http://old.nabble.com/make-table-wisth-adjustable-tp26897575s27240p26897575.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] huge drop down
is my question not clear ? please help me reoslve this
fachhoch wrote:
after big search I got this code
$(document).ready(function(){
$('#program').wrap(div class='wrapper'/div);
$('.wrapper').after(div class='selectArrow'/);
$('.wrapper').find('select').mousedown(function(){
$(this).parent().next().addClass('selectArrow-mousedown').removeClass('selectArrow-mouseover');
}).
mouseup(function(){
$(this).parent().next().removeClass('selectArrow-mousedown').addClass('selectArrow-mouseover');
}).
hover(function(){
$(this).parent().next().addClass('selectArrow-mouseover');
}, function(){
$(this).parent().next().removeClass('selectArrow-mouseover');
});
$('.selectArrow').click(function(){
$(this).prev().find('select').focus();
});
$('.selectArrow').mousedown(function(){
$(this).addClass('selectArrow-mousedown').removeClass('selectArrow-mouseover');
}).
mouseup(function(){
$(this).removeClass('selectArrow-mousedown').addClass('selectArrow-mouseover');
}).
hover(function(){
$(this).addClass('selectArrow-mouseover');
}, function(){
$(this).removeClass('selectArrow-mouseover');
});
});
css for this
.wrapper{
display: inline;
float: left;
width: 180px;
overflow: hidden;
}
.selectArrow{
display: inline;
float: left;
width: 17px;
height: 20px;
border:1px solid #7f9db9;
border-left: none;
background: url('images/selectArrow.png') no-repeat 1px 1px;
}
.selectArrow-mousedown{background:
url('images/selectArrow-mousedown.png') no-repeat 1px 1px;}
.selectArrow-mouseover{background:
url('images/selectArrow-mouseover.png') no-repeat 1px 1px;}
attached is the image of my problem
http://old.nabble.com/file/p26870017/program.png
see the image doesnot align with the height of dropdown , please help
me .
please help me resolve this
Charlie Tomlinson wrote:
IE gives limited support to what you can do to style selects. As
suggested use a plugin, of which there are many, that convert select's
to alternate html yet retain similar functionality
fachhoch wrote:
that did not help me , I triedgoogle search but none of them worked
for
me , please, jquery experts tell me how to CONTROL WIDTH of dropdown IN
IE ,
Scott Sauyet-2 wrote:
You might look at a plug-in like:
http://code.google.com/p/dropdown-check-list/
Good luck,
-- Scott
--
View this message in context:
http://old.nabble.com/huge-drop-down-tp26720940s27240p26877570.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] huge drop down
Sorry .I am a java programmer , but dumb with css ,java script and specially working with IE , unfortunately every body has to work for IE, sorry again Scott Sauyet-2 wrote: On Dec 21, 1:11 pm, fachhoch fachh...@gmail.com wrote: is my question not clear ? please help me reoslve this Your own urgency is not enough motivation for the rest of us. First you post a question that you could probably have researched easily on your own to find out that IE will really not allow you to style the drop-down element. Then when several of us suggested plug- ins that convert your drop-down into something you can style, you tell us that it won't do for our needs and you yell at us with please, jquery experts tell me how to CONTROL WIDTH of dropdown IN IE Then you go ahead and make a stab at solving your problem by converting your drop-down into something you can style. When the style isn't quite what you want, you post a great deal of irrelevant code, and then ask of this group -- which focuses on a particular Javascript library -- for help with what looks to be a CSS or HTML problem. And you do not post a test case anywhere that we might use for testing. And then you whine about it when no one has followed up for thirteen hours, quoting your entire previous post in the process. I'd love to be able to help, but you're not holding up your end of the bargain. -- Scott -- View this message in context: http://old.nabble.com/huge-drop-down-tp26720940s27240p26879049.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] huge drop down
that did not help me , I triedgoogle search but none of them worked for me , please, jquery experts tell me how to CONTROL WIDTH of dropdown IN IE , Scott Sauyet-2 wrote: You might look at a plug-in like: http://code.google.com/p/dropdown-check-list/ Good luck, -- Scott -- View this message in context: http://old.nabble.com/huge-drop-down-tp26720940s27240p26868258.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] huge drop down
after big search I got this code
$(document).ready(function(){
$('#program').wrap(div class='wrapper'/div);
$('.wrapper').after(div class='selectArrow'/);
$('.wrapper').find('select').mousedown(function(){
$(this).parent().next().addClass('selectArrow-mousedown').removeClass('selectArrow-mouseover');
}).
mouseup(function(){
$(this).parent().next().removeClass('selectArrow-mousedown').addClass('selectArrow-mouseover');
}).
hover(function(){
$(this).parent().next().addClass('selectArrow-mouseover');
}, function(){
$(this).parent().next().removeClass('selectArrow-mouseover');
});
$('.selectArrow').click(function(){
$(this).prev().find('select').focus();
});
$('.selectArrow').mousedown(function(){
$(this).addClass('selectArrow-mousedown').removeClass('selectArrow-mouseover');
}).
mouseup(function(){
$(this).removeClass('selectArrow-mousedown').addClass('selectArrow-mouseover');
}).
hover(function(){
$(this).addClass('selectArrow-mouseover');
}, function(){
$(this).removeClass('selectArrow-mouseover');
});
});
css for this
.wrapper{
display: inline;
float: left;
width: 180px;
overflow: hidden;
}
.selectArrow{
display: inline;
float: left;
width: 17px;
height: 20px;
border:1px solid #7f9db9;
border-left: none;
background: url('images/selectArrow.png') no-repeat 1px 1px;
}
.selectArrow-mousedown{background:
url('images/selectArrow-mousedown.png') no-repeat 1px 1px;}
.selectArrow-mouseover{background:
url('images/selectArrow-mouseover.png') no-repeat 1px 1px;}
attached is the image of my problem
http://old.nabble.com/file/p26870017/program.png
see the image doesnot align with the height of dropdown , please help me
.
please help me resolve this
Charlie Tomlinson wrote:
IE gives limited support to what you can do to style selects. As
suggested use a plugin, of which there are many, that convert select's
to alternate html yet retain similar functionality
fachhoch wrote:
that did not help me , I triedgoogle search but none of them worked
for
me , please, jquery experts tell me how to CONTROL WIDTH of dropdown IN IE
,
Scott Sauyet-2 wrote:
You might look at a plug-in like:
http://code.google.com/p/dropdown-check-list/
Good luck,
-- Scott
--
View this message in context:
http://old.nabble.com/huge-drop-down-tp26720940s27240p26870017.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] huge drop down
It does not work in IE , what should I do for IE ? Bideshi wrote: hi there, it's so simple to do this, just add a style in your drop down control, select style=width:200px /select -- On Dec 10, 6:48 am, fachhoch fachh...@gmail.com wrote: My page got a very big drop down list attached is the imagehttp://old.nabble.com/file/p26720940/programs-drop-down.png I need suggestions in reducing the width of this drop down , I cannot replace the text inside this drop down , but I want to reduce the size overall , any suggestions ,help is greatly appreciated. -- View this message in context:http://old.nabble.com/huge-drop-down-tp26720940s27240p26720940.html Sent from the jQuery General Discussion mailing list archive at Nabble.com. -- View this message in context: http://old.nabble.com/huge-drop-down-tp26720940s27240p26729658.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] 508 accessibility for tabs
I have tabs in my page attached is the image. I need suggestions on making the tabs 508 , please suggest me on tricks or ways to make tabs inside a page 508, also link for tabs i ma talking http://flowplayer.org/tools/tabs.html here is the image http://old.nabble.com/file/p26714128/tabs.png -- View this message in context: http://old.nabble.com/508-accessibility--for-tabs-tp26714128s27240p26714128.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] huge drop down
My page got a very big drop down list attached is the image http://old.nabble.com/file/p26720940/programs-drop-down.png I need suggestions in reducing the width of this drop down , I cannot replace the text inside this drop down , but I want to reduce the size overall , any suggestions ,help is greatly appreciated. -- View this message in context: http://old.nabble.com/huge-drop-down-tp26720940s27240p26720940.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] here is my html
here is my html [CODE] div style= margin-bottom: 0.5em; font-weight: bold; width: 100%; border: 1px solid #0079D6 ; div style=float: left; width: 75%; ul style=margin: 0pt 0pt 0.5em 0.5em; list-style-type: none; list-style-image: none; list-style-position: outside; liGrant Program: label style=font-weight: normal; wicket:id=porgramName/ (label wicket:id=porgramAcronym/)/li liAction Official: label style=font-weight: normal; wicket:id=grantsOfficerfname/ label style=font-weight: normal; wicket:id=grantsOfficerlname/ /li /ul /div div style=float: left; width: 25%; ul style=margin-left: 0.5em; list-style-type: none; list-style-image: none; list-style-position: outside; li Assign Action Official /li li Assign Finding(s) to Grant Program /li /ul /div table cellspacing=0 class=dataview style=margin-left: .5em; width: 95%; wicket:id=programFindingsContainer thead tr thFinding #/th thFinding Type/th th style=text-align: right;Recommended Amount/th thGrant Identifier/th thAppropriation Number(s)/th thCAN(s)/th thAction/th /tr /thead [/CODE] the first two divs works fine , but the third table floats left and dosent come below the div, ,please suggest how can I push the table below the div , Its working in IE and firefox but not in chrome , please suggest me.Attached is the image http://old.nabble.com/file/p26721021/program.png -- View this message in context: http://old.nabble.com/here-is-my-html-tp26721021s27240p26721021.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] 508 accessibility
I created expand collapse behavior using jquery , please suggest me is there any thing in jquery api which adds necessary attributes to make it 508 accessible ? -- View this message in context: http://www.nabble.com/508-accessibility-tp24356957s27240p24356957.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
