0

<h3>当鼠标悬停在使用 jQuery的标记文本上时,如何缩放标记的文本?

这是 JavaScript 代码。

 var bindBehaviors = function (scope) {
            $('h3',scope).hover(
            function () {
            $(this).css("font-size", "40px");
            },
           function () {
           $(this).css("font-size", "25px");
           }
           );
           }
           bindBehaviors(this);

它正在改变它的大小,但是当我将鼠标放在包含<h3>文本的行的任何位置时,它就会发生。为什么?另一个问题是定位。

ASPX 代码如下。

<form id="form1" runat="server">
  <div id="dictionary">
  </div>
  <div class="letters">
    <div class="button" id="letter-a">
      <h3>A</h3>
      <button type="button">Load</button> 
    </div>
    <div class="button" id="letter-b">
      <h3>B</h3>
      <button type="button">Load</button> 
    </div>
    <div class="button" id="letter-c">
      <h3>C</h3>
      <button type="button">Load</button> 
    </div>
    <div class="button" id="letter-d">
      <h3>D</h3>
      <button type="button">Load</button> 
    </div>
  </div>
  <div class="button" id="letter-f">F
    <form>
      <input type="text" name="term" value="" id="term" />
      <input type="submit" name="search" value="search" id="search" />
    </form>
  </div>
  <div id="loading">
    Loading...
  </div>
</form>
4

2 回答 2

2

你有几个选择。

只是CSS。

h3
{
    transform: scale(1);
}

h3:hover
{
    transform: scale(1.5);
}

JS(jQuery)

$('h3').hover(
    function()
    {
        $(this).effect('scale',{percent:200},1000);
    },
    function()
    {
        $(this).effect('scale',{percent:50},1000);
    },     
);

类似的东西可能会有所帮助。

于 2012-08-10T07:48:07.247 回答
1

html:<h3>Some text</h3>

CSS:h3 {font-size: 14px;}

jQuery:

$('h3').hover(
  function () {
    $(this).css("font-size", "16px");
  },
  function () {
    $(this).css("font-size", "14px");
  }
);
于 2012-08-10T07:34:40.060 回答