[英]Display the drop down values when mouse-over on text instead of textfield
請訪問鏈接
在左上角,您會看到帶有下拉框的“ 當前 ”。 一旦將鼠標懸停在上面,您將看到如下所示
在同一鏈接中,如果您向下滾動,則可以看到過濾器: Device, Design, Category, Sort by
將鼠標懸停在Design上后 ,您將看到下圖所示的圖像
我還需要“貨幣”的相同功能。
意味着,我要刪除文本字段。
一旦我們將鼠標懸停在“貨幣”文本上,它就會顯示下拉值。
腳本
<script>
jQuery(document).ready(function () {
jQuery('select#select-language').hover(function () {
jQuery(this).attr('size', jQuery('option').length);
}, function () {
jQuery(this).attr('size', 1);
});
});
</script>
的CSS
select#select-language {
position: absolute;
top: 30px;
z-index: 2;
margin-top: -2em;
margin-left: 4em;
padding-right: 2em;
}
option:hover {
color: white;
background: #0000FF;
}
</style>
phtml
<?php if(count($this->getStores())>1): ?>
<div class="form-language">
<label for="select-language"><?php echo $this->__('Currency:') ?></label>
<select id="select-language" title="<?php echo $this->__('Your Language') ?>" onchange="window.location.href=this.value">
<?php foreach ($this->getStores() as $_lang): ?>
<?php $_selected = ($_lang->getId() == $this->getCurrentStoreId()) ? ' selected="selected"' : '' ?>
<option value="<?php echo $_lang->getCurrentUrl() ?>"<?php echo $_selected ?>><?php echo $this->escapeHtml($_lang->getName()) ?></option>
<?php endforeach; ?>
</select>
</div>
<?php endif; ?>
(未經測試)我相信當您將鼠標懸停在帶有文字“貨幣”的標簽上時,該下拉菜單會顯示出來。
<script>
jQuery(document).ready(function () {
jQuery('select#select-language').hide();
jQuery('#yourlabelid').hover(function () {
jQuery('select#select-language').show();
});
});
</script>
更改
<label for="select-language"><?php echo $this->__('Currency:') ?></label>
至
<label id="relevantname" for="select-language"><?php echo $this->__('Currency:') ?></label>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.