2

私のMVC3プロジェクト（Twiter Bootstrapを使用）には、2つのラジオボタンがあるページがあります。2番目のマウスにマウスを合わせると、ビューにBootstrapツールチップが表示されます。さらに、ツールチップのCSSの外観を黄色に変更するJS関数があります。

JS関数にいくつかのcssプロパティを追加して、透明度を削除し、グラデーションを適用したいと思います。このようなもの：

background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#FCEEC1),color-stop(100%,#EEDC94));

私は千の方法を試しましたが、できません。手伝っていただけませんか？

前もって感謝します！！

私のラジオボタン：

<span class="radio-button-revoked" title="CAUTION! Selecting this option will cause the revocation of the order delivery">
@Html.RadioButtonFor(model => model.Status, 0, new { style = "margin-top: 0px;" })</span><span class="text-error"><strong> Not delivered</strong>
</span>

私のJS：

function changeTooltipColorTo(color, textcolor) {
    $('.tooltip-inner').css('background-color', color)
    $('.tooltip-inner').css('color', textcolor)
    $('.tooltip-inner').css('font-weight', 'bold')
    $('.tooltip.top .tooltip-arrow').css('border-top-color', color);
    $('.tooltip.right .tooltip-arrow').css('border-right-color', color);
    $('.tooltip.left .tooltip-arrow').css('border-left-color', color);
    $('.tooltip.bottom .tooltip-arrow').css('border-bottom-color', color);
}

$(document).ready(function () {
    $("[rel=tooltip]").tooltip();
    $('.radio-button-revoked').hover(function() {changeTooltipColorTo('#F89406','#404040')});
});

更新：ほぼ解決しました。グラデーションを設定します。

$('.tooltip-inner').css('background-image', '-webkit-gradient(linear,left top,left bottom,color-stop(0%,#FCEEC1),color-stop(100%,#E4BF46))')

0.1から1の値を設定することで、グラデーションで遊ぶことができることに気づきました。

$('.tooltip-inner').css('opacity', '0.1')

$('.tooltip-inner').css('opacity', '1')

しかし、私はそれを完全に不透明にすることはできません:(

4

2 に答える 2

3

識別子.tooltip.inを使用して、ツールチップの不透明度を変更できます。

したがって、完全に不透明にしたい場合は、次を使用してください。

.tooltip.in {
    opacity: 1;
    filter: alpha(opacity=100);
}
于 2015-05-27T03:47:37.900 に答える
0

解決しました。

bootstrap.cssがjavascriptで定義されたCSSスタイルと重複していたため、bootstrap.cssの不透明度の値を変更しましたが、CSSを変更せずに変更する方法はありますか？

于 2013-03-27T16:21:31.913 に答える