jQuery，在addClass和removeClass之前调用类

代码运行良好，但我无法控制自己的布局。一旦链接被按下，它将在两个按钮状态之间正确切换。 在链接被按下之前，我怎样称呼'加班'？请帮忙。另外，我已经试过div的，跨越组织，但它需要一些tweeking
感谢，jQuery，在addClass和removeClass之前调用类

enter image description here

<html> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script> 
</head> 
<style type="text/css"> 
    #h6{font-size: 12px; padding-right: 0px;} 
    .plus{left:0px;height:33px;width:32px; background:url('sprite.gif') 0 0px;} 
    .minus{left:0px;height:33px;width:32px; background:url('sprite.gif') 0 -34px;} 
</style> 
<h6 id="deToggle"><a href="#" class="styles2" id="h6">Larger</a></h6> 
<script language="javascript"> 
    var click = 0%2; 
    var fontSizes = [14, 16] 
    $('#deToggle').toggle(
     function(){ 
      var sprot = $('#deToggle');// 
      var tog = $('#deToggle'); 
      tog.html('<a href="#">Larger</a>'); 
      $('#OurText').css('fontSize', fontSizes[1] + 'px'); 
      $(this).val("-"); 
      tog.addClass('plus'); 
      tog.removeClass('minus'); 
     }, 
     function(){ 
      var tog = $('#deToggle'); 
      tog.html('<a href="#">Smaller</a>'); 
      $('#OurText').css('fontSize', fontSizes[0]+ 'px'); 
      $(this).val("+"); 
      tog.removeClass('plus'); 
      tog.addClass('minus'); 
     }); 
</script> 
<p id="OurText">My Text!!!</p> 
</html>

sprit.gif鼠标经过图像 enter image description here

来源

2011-03-08 DisEngaged

我最初以为＃H6是在你的CSS一个错误，但此时才明白你有id为“H6”锚标记。这造成了很大的混乱。试着给id提供更有意义的名字。 – Mahesh 2011-03-08 10:34:46

您的意思是您想要将该类应用于初始页面加载？

调用代码在初始页面加载时添加plus类。我也重构你的代码的功能，并把它所有的jQuery的document.ready功能

$(document).ready(function(){ 
    Plus(); 

    $('#deToggle').toggle(function(){ 
     Plus(); 
    }, function(){ 
     Minus(); 
    }); 

}); 

function Plus(){ 
    var sprot = $('#deToggle');// 
    var tog = $('#deToggle'); 
    tog.html('<a href="#">Larger</a>'); 
    $('#OurText').css('fontSize', fontSizes[1] + 'px'); 
    $(this).val("-"); 
    tog.addClass('plus'); 
    tog.removeClass('minus'); 
} 

function Minus(){ 
    var tog = $('#deToggle'); 
    tog.html('<a href="#">Smaller</a>'); 
    $('#OurText').css('fontSize', fontSizes[0]+ 'px'); 
    $(this).val("+"); 
    tog.removeClass('plus'); 
    tog.addClass('minus'); 
}

来源

2011-03-08 09:54:27

-1

css('fontSize', fontSizes[0]+ 'px');

应该be：

css('font-size', fontSizes[0]+ 'px'); 
     ↑

fontSize用于animate（）。此外，您不需要+'px'所有数字css值可以作为数字给出。

来源

2011-03-08 09:42:06

这个答案是从哪里来的，它是否与这个问题有关？ – Prakash 2011-03-08 09:50:48

不错的箭头虽然... :) – 2011-03-08 09:56:42

@geoff箭头不是我的：D balexandre添加了它... – 2011-03-08 09:59:24

我是这样的

前2日内答复见here

求人

DEMO

来源

2011-03-08 09:43:38 diEcho

@FXquincy根据需要应用CSS和图像，这里只是逻辑 – diEcho 2011-03-08 09:45:47

您需要添加的文档类型为CSS工作。在头标签

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

来源

2011-03-08 09:43:55 andsien

这是因为你没有设置初始大小之前添加此。你可以使用CSS或JavaScript。

推荐的方法是使用CSS。添加到您的风格

#OurText { 
    font-size: 14px; 
}

观看演示。 http://jsfiddle.net/RV5LE/

我已经清理了一下你的代码。并且下一次在jsfiddle上发布您的问题副本

来源

2011-03-08 09:50:21 Mahesh

jQuery，在addClass和removeClass之前调用类

回答

相关问题