드롭 다운은 CSS HTML에서 사용자의 이미지와 이름을 표시합니다.

이미지가있는 사용자가 포함 된 드롭 다운 상자를 만들고 싶습니다. 이 이미지처럼 : Credits : Kendo. 필요한 경우 CSS 및 js만으로이 유형의 드롭 다운을 만들고 싶습니다. 이것은 플러그인없이 할 수 있습니까? 드롭 다운은 CSS HTML에서 사용자의 이미지와 이름을 표시합니다.

다음은 데이터베이스와 PHP에서 내 샘플 출력입니다 :

$link=mysqli_connect('127.0.0.1','user','pass'); 
 
mysqli_select_db($link,"db"); 
 
$Sunshine_Award=mysqli_query($link,"select * from Sunshine_Award"); 
 
echo "<select style="width:161px; height: 33px; border-radius: 5px;"/>"; 
 
while($Sunshine_Rows=mysqli_fetch_array($Sunshine_Award)) 
 
\t \t { 
 
\t \t \t 
 

 
\t \t \t echo "<option>".$Sunshine_Rows['name']."</option>"; 
 
      
 

 
\t \t } 
 
echo "</select>";

출처

2017-12-09 Rae Ian

Stackoverflow는 코드 작성 서비스가 아닙니다. 그걸 가지고 가다가 붙어 있다면 돌아와. –

예 샘플 출력이 있습니다. 나는 여기에 데이터베이스에서 많은 사용자가 포함 된 드롭 다운 있지만 정말이 유형의 CSS 코드에 문제가 있습니다. –

가지고있는 코드를 게시 할 수 있습니까? –

$(document).ready(function(){ 
 
    $("#flip").click(function(){ 
 
     $("#panel").slideToggle("slow"); 
 
    }); 
 
});

<style> 
 
#panel, #flip { 
 
    padding: 5px; 
 
    text-align: center; 
 
    background-color: green; 
 
    border: solid 1px blue; 
 
} 
 

 
#panel { 
 
    padding: 50px; 
 
    display: none; 
 
} 
 
</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<body> 
 
    
 
<div id="flip">Click to slide down panel</div> 
 
<div id="panel"> 
 

 
<div id=users>user name</div><div id=users>user name</div></div> 
 
</body>

사용자 이름을 & 이미지 insid 삽입하는 서버 측 프로그램을 사용하여 e #panel

출처

2017-12-09 13:09:33

안녕하세요. 이것은 콤보 상자이기 때문에 내가 작동하지 않는 사용자 중 하나를 선택하려고하면 작동합니다. –

div 요소에 활성으로 CSS를 추가하기 만하면됩니다. –

드롭 다운은 CSS HTML에서 사용자의 이미지와 이름을 표시합니다.

답변

관련 문제