从左到右滑动卡住

时间:2016-10-28 14:30:02

标签: javascript jquery html css slide

多页幻灯片我有一些奇怪的问题。当我按下切换页面时,新页面被卡在左侧,然后滑出,需要它。您可以在我的JSFiddle

中对此进行测试

有我的JQuery。 (我是新的)

$(document).ready(function(){
$("div.page-content div.page").hide();
$(".page-content div.page:first-child").show();

$("a.edit").click(function() {  // EDIT BUTTON
    $("div.page-content .page").hide();
    var activeTab = $(this).attr("href"); 
    var effect = 'slide';var options = { direction: 'right'};var duration = 1000;
    $(activeTab).toggle(effect, options, duration);
});

$("a.back").click(function() {  // BACK BUTTON
    $("div.page-content .page").hide();
    var activeTab = $(this).attr("href"); 
    var effect = 'slide';var options = { direction: 'left'};var duration = 1000;
    $(activeTab).toggle(effect, options, duration);
});

}); 

任何解决方案,为什么我有这个问题?

1 个答案:

答案 0 :(得分:1)

当使用activetab幻灯片的切换隐藏时,您需要将当前页面滑出以使其平稳运行。使用以下js代码,看看是否能产生您想要的效果:

import UIKit
import QuartzCore


class ViewController: UIViewController, CALayerDelegate, CAAnimationDelegate {

var shapeLayer = CAShapeLayer()


override func viewDidLoad() {
    super.viewDidLoad()
    highlight(XCord: 100, YCord: 100)
    clearhighlight()
    // Do any additional setup after loading the view, typically from a nib.
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}

func highlight(XCord: CGFloat, YCord: CGFloat) {
    DispatchQueue.main.async {
        let circlePath = UIBezierPath(arcCenter: CGPoint(x: XCord,y: YCord), radius: CGFloat(20), startAngle: CGFloat(0), endAngle:CGFloat(M_PI * 2), clockwise: true)

        self.shapeLayer.path = circlePath.cgPath

        //change the fill color
        //shapeLayer.fillColor = UIColor.clear.cgColor
        self.shapeLayer.fillColor = UIColor.red.cgColor
        self.shapeLayer.opacity = 0.5
        self.shapeLayer.fillRule = kCAFillRuleEvenOdd

        //you can change the stroke color
        self.shapeLayer.strokeColor =  UIColor.red.cgColor
        //you can change the line width
        self.shapeLayer.lineWidth = 3.0

        DispatchQueue.main.async {
            self.view.layer.addSublayer(self.shapeLayer)
        }
    }
}

func clearhighlight() {
    DispatchQueue.main.async {
        let fadeInAndOut = CABasicAnimation(keyPath: "opacity")
        fadeInAndOut.duration = 10.0;
        //fadeInAndOut.autoreverses = true;
        fadeInAndOut.repeatCount = 1
        fadeInAndOut.fromValue = 1.0
        fadeInAndOut.toValue = 0.0
        fadeInAndOut.isRemovedOnCompletion = true
        fadeInAndOut.fillMode = kCAFillModeForwards;
        //self.view.layer.delegate = self
        self.shapeLayer.delegate = self
        self.shapeLayer.add(fadeInAndOut, forKey: "fadeOut")
        self.shapeLayer.setNeedsDisplay()
    }
}

func animationDidStop(_ anim: CAAnimation, finished flag: Bool) {
    print("animationDidStop")
    DispatchQueue.main.async {
        self.shapeLayer.removeFromSuperlayer()
    }
}



}

希望这有帮助。