各位高手,请教做带图片下拉菜单问题
各位大虾, 怎么做可以显示带图片的下拉菜单啊 问题点数:20、回复次数:12Top
1 楼dullwolf(超级大笨狼之羊皮马甲)回复于 2004-05-04 20:21:19 得分 0
这个嘛只能模拟拉。Top
2 楼dullwolf(超级大笨狼之羊皮马甲)回复于 2004-05-04 21:47:57 得分 20
我模拟了一个,你使用的时候修改LEFT,Top等的数值,放到合适的位置。
提交的时候用get方法提交相应属性。如果用post方法再放一个隐藏input,
不懂的地方再发短消息问我。
<HTML>
<HEAD>
<style>
.a
{
BORDER-RIGHT: lightblue 1px solid;
BORDER-TOP: lightblue 1px solid;
LEFT: 280px;
BORDER-LEFT: lightblue 1px solid;
WIDTH: 100px;
BORDER-BOTTOM: lightblue 1px solid;
POSITION: absolute;
TOP: 37px;
HEIGHT: 24px;
}
.b
{
FONT-SIZE: 9px;
BORDER-LEFT-COLOR:lightblue;
LEFT: 358px;
BORDER-BOTTOM-COLOR:
lightblue;
WIDTH: 20px;
COLOR: mediumblue;
BORDER-TOP-STYLE: solid;
BORDER-TOP-COLOR: lightblue;
BORDER-RIGHT-STYLE: solid;
BORDER-LEFT-STYLE: solid;
POSITION: absolute;
TOP: 39px;
HEIGHT: 20px;
BACKGROUND-COLOR: white;
BORDER-RIGHT-COLOR: lightblue;
BORDER-BOTTOM-STYLE: solid;
FILTER: progid:DXImageTransform.Microsoft.Matrix(SizingMethod ='auto expand',FilterType=bilinear,Dx=0,Dy=0,M11=-1,M12=0,M21=0,M22=-1);
}
.c
{
LEFT: 280px;
WIDTH: 100px;
POSITION: absolute;
TOP: 60px;
HEIGHT: 24px;
display:none;
cursor:pointer;
}
</style>
</HEAD>
<BODY>
<SELECT id=select1 >
<OPTION selected>111</OPTION>
<OPTION >222</OPTION>
<OPTION >333</OPTION>
</SELECT>
<INPUT id=select2 class="a">
<INPUT type=button value="▲" class="b" onclick="ddd(this);" title="">
<TABLE border="1" CELLPADDING=0 CELLSPACING=0 bordercolor="lightblue" class="c" onclick="aaa(this);">
<TR>
<TD bordercolor="#FFFFFF" onmouseover="bbb(this);" onmouseout="ccc(this);" title="1">
<img src="http://expert.csdn.net/expert/images/rank/star1.gif">1星
</TD>
</TR>
<TR>
<TD bordercolor="#FFFFFF" onmouseover="bbb(this);" onmouseout="ccc(this);" title="2">
<img src="http://expert.csdn.net/expert/images/rank/star2.gif">2星
</TD>
</TR>
<TR>
<TD bordercolor="#FFFFFF" onmouseover="bbb(this);" onmouseout="ccc(this);" title="3">
<img src="http://expert.csdn.net/expert/images/rank/star3.gif">3星
</TD>
</TR>
</TABLE>
<SCRIPT >
function aaa(obj)
{
previousSibling(previousSibling(obj)).value= window.event.srcElement.innerText;
previousSibling(previousSibling(obj)).title= window.event.srcElement.abbr;
eee(obj);
}
function bbb(obj)
{
obj.borderColor="#FF0000";
}
function ccc(obj)
{
obj.borderColor="#ffffff";
}
function ddd(obj)
{
nextSibling(obj).style.display="block";
}
function eee(obj)
{
obj.style.display="none";
}
function nextSibling(obj)
{
for(i=1;i<obj.document.all.length;i++)
{
if(obj==obj.document.all(i))
{
return(obj.document.all(i+1))
}
}
}
function previousSibling(obj)
{
for(i=1;i<obj.document.all.length;i++)
{
if(obj==obj.document.all(i))
{
return(obj.document.all(i-1))
}
}
}
</SCRIPT>
</BODY></HTML>Top
3 楼dullwolf(超级大笨狼之羊皮马甲)回复于 2004-05-04 21:49:29 得分 0
更正一下:
function aaa(obj)
{
previousSibling(previousSibling(obj)).value= window.event.srcElement.innerText;
previousSibling(previousSibling(obj)).title= window.event.srcElement.title;
eee(obj);
}Top
4 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-05-04 22:06:13 得分 0
可以改成htc,我脚本里面用的都是相对的对象,没用对象名称,我有时间的时候再琢磨一下,现在要玩去了。
dullwolf和superdullwolf都是我拉!
:)
那个帐号不能回复三个以上的帖子,所以我用这个登陆了。
要给分的话给dullwolf,我计划把那个帐号也弄成两星,好象三星没希望了。
<HTML>
<HEAD>
<style>
.a
{
BORDER-RIGHT: lightblue 1px solid;
BORDER-TOP: lightblue 1px solid;
LEFT: 280px;
BORDER-LEFT: lightblue 1px solid;
WIDTH: 100px;
BORDER-BOTTOM: lightblue 1px solid;
POSITION: absolute;
TOP: 37px;
HEIGHT: 24px;
}
.b
{
FONT-SIZE: 9px;
BORDER-LEFT-COLOR:lightblue;
LEFT: 358px;
BORDER-BOTTOM-COLOR:
lightblue;
WIDTH: 20px;
COLOR: mediumblue;
BORDER-TOP-STYLE: solid;
BORDER-TOP-COLOR: lightblue;
BORDER-RIGHT-STYLE: solid;
BORDER-LEFT-STYLE: solid;
POSITION: absolute;
TOP: 39px;
HEIGHT: 20px;
BACKGROUND-COLOR: white;
BORDER-RIGHT-COLOR: lightblue;
BORDER-BOTTOM-STYLE: solid;
FILTER: progid:DXImageTransform.Microsoft.Matrix(SizingMethod ='auto expand',FilterType=bilinear,Dx=0,Dy=0,M11=-1,M12=0,M21=0,M22=-1);
}
.c
{
LEFT: 280px;
WIDTH: 100px;
POSITION: absolute;
TOP: 60px;
HEIGHT: 24px;
display:none;
cursor:pointer;
}
</style>
</HEAD>
<BODY>
<SELECT id=select1 >
<OPTION selected>111</OPTION>
<OPTION >222</OPTION>
<OPTION >333</OPTION>
</SELECT>
<INPUT id=select2 class="a">
<INPUT type=button value="▲" class="b" onclick="ddd(this);" title="">
<TABLE border="1" CELLPADDING=0 CELLSPACING=0 bordercolor="lightblue" class="c" onclick="aaa(this);">
<TR>
<TD bordercolor="#FFFFFF" onmouseover="bbb(this);" onmouseout="ccc(this);" title="1">
<img src="http://expert.csdn.net/expert/images/rank/star1.gif">1星
</TD>
</TR>
<TR>
<TD bordercolor="#FFFFFF" onmouseover="bbb(this);" onmouseout="ccc(this);" title="2">
<img src="http://expert.csdn.net/expert/images/rank/star2.gif">2星
</TD>
</TR>
<TR>
<TD bordercolor="#FFFFFF" onmouseover="bbb(this);" onmouseout="ccc(this);" title="3">
<img src="http://expert.csdn.net/expert/images/rank/star3.gif">3星
</TD>
</TR>
</TABLE>
<SCRIPT >
function aaa(obj)
{
previousSibling(previousSibling(obj)).value= window.event.srcElement.innerText;
previousSibling(previousSibling(obj)).title= window.event.srcElement.title;
eee(obj);
}
function bbb(obj)
{
obj.borderColor="#FF0000";
}
function ccc(obj)
{
obj.borderColor="#ffffff";
}
function ddd(obj)
{
nextSibling(obj).style.display="block";
}
function eee(obj)
{
obj.style.display="none";
}
function nextSibling(obj)
{
for(i=1;i<obj.document.all.length;i++)
{
if(obj==obj.document.all(i))
{
return(obj.document.all(i+1))
}
}
}
function previousSibling(obj)
{
for(i=1;i<obj.document.all.length;i++)
{
if(obj==obj.document.all(i))
{
return(obj.document.all(i-1))
}
}
}
</SCRIPT>
</BODY></HTML>
Top
5 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-05-04 22:07:05 得分 0
多给点分偶是不介意滴!
做完肩膀好疼啊!Top
6 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-05-04 22:07:51 得分 0
知道偶能发多少回贴吗?Top
7 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-05-04 22:08:03 得分 0
真的不知道?Top
8 楼superdullwolf(超级大笨狼,每天要自强,MVP)回复于 2004-05-04 22:08:25 得分 0
嘿嘿,俺也不知道:)Top
9 楼dullwolf(超级大笨狼之羊皮马甲)回复于 2004-05-04 22:21:53 得分 0
哦,好象我跑题了,好象你要的是菜单,而不是selectTop
10 楼dullwolf(超级大笨狼之羊皮马甲)回复于 2004-05-05 03:41:00 得分 0
参考这个吧
http://expert.csdn.net/Expert/topic/3027/3027427.xml?temp=6.130618E-02Top
11 楼jolyjacky(逍遥散人)回复于 2004-05-06 22:04:45 得分 0
大虾,还有一点小问题,怎么在图象右边不显示文字,而点击图片后仍然可以在文本框中加入相应的文本呢,还有当有很多图片要在下拉菜单中显示时,怎么控制它不让窗口滚动条加长,即不会影响当前窗口的状况,但仍然可以全部显示图片Top
12 楼chinadrgon(zhouzhou)回复于 2004-05-06 23:53:16 得分 0
dullwolf(超级大笨狼过程版(★★)) && superdullwolf(超级大笨狼,每天要自强)
I 服 you!!!!!!真是灌水高高高手!Top




