我在下面给出了jquery函数来在lightbox图像carousal中显示图像。它工作正常,除了当用户点击下一个导航按钮以查看下一个图像时,当前图像闪烁一次然后显示下一个图像。我希望在淡出之前移除此图像闪烁并希望实现平滑的淡出效果。怎么做?
function view_post(id, nav) {
var viewer = $("#post-viewer");
var userid = '';
var page = '';
if (nav != undefined && nav) {
var lists = $(".post-list");
userid = lists.data('userid');
page = lists.data('page');
}
showLoader();
$.ajax({
url : baseUrl + 'post/load?id=' + id,
data : {userid:userid,page:page},
success: function(t) {
viewer.find('.content').html(t);
viewer.fadeIn();
viewer.find('.close').click(function() {
viewer.fadeOut();
viewer.find('.content').html('');
return false;
})
viewer.find('.cover').click(function() {
viewer.fadeOut();
viewer.find('.content').html('');
var url = baseUrl;
var title = 'Title';
if (typeof (history.pushState) != "undefined") {
var obj = { Title: title, Url: url };
history.pushState(obj, obj.Title, obj.Url);
} else {
alert("Browser does not support HTML5.");
}
return false;
})
hideLoader();
reload_init();
}
});
return false;
}
答案 0 :(得分:0)
查看您的代码,您正在尝试<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>org.jvnet.jaxb2.maven2</groupId>
<artifactId>divide</artifactId>
<version>0.0.1-SNAPSHOT</version>
<dependencies>
<dependency>
<groupId>org.glassfish.jaxb</groupId>
<artifactId>jaxb-runtime</artifactId>
<version>2.2.11</version>
</dependency>
<!-- JUnit -->
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<scope>test</scope>
<version>4.12</version>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.codehaus.mojo</groupId>
<artifactId>xml-maven-plugin</artifactId>
<version>1.0.2</version>
<executions>
<execution>
<goals>
<goal>transform</goal>
</goals>
<phase>process-sources</phase>
</execution>
</executions>
<configuration>
<transformationSets>
<transformationSet>
<dir>${project.build.directory}/xjc-c/META-INF</dir>
<outputDir>${project.build.directory}/xjc-c/META-INF</outputDir>
<includes>
<include>sun-jaxb.episode</include>
</includes>
<stylesheet>src/main/xslt/removeJaxbSchemaBindings.xslt</stylesheet>
</transformationSet>
</transformationSets>
</configuration>
</plugin>
<plugin>
<groupId>org.jvnet.jaxb2.maven2</groupId>
<artifactId>maven-jaxb2-plugin</artifactId>
<version>0.13.3</version>
<executions>
<execution>
<id>xjc-c</id>
<goals>
<goal>generate</goal>
</goals>
<phase>generate-sources</phase>
<configuration>
<generatePackage>test.c</generatePackage>
<generateDirectory>${project.build.directory}/xjc-c</generateDirectory>
<schemaIncludes>
<includes>c.xsd</includes>
</schemaIncludes>
</configuration>
</execution>
<execution>
<id>xjc-a</id>
<goals>
<goal>generate</goal>
</goals>
<phase>generate-resources</phase>
<configuration>
<generatePackage>test.a</generatePackage>
<generateDirectory>${project.build.directory}/xjc-a</generateDirectory>
<schemaIncludes>
<includes>a.xsd</includes>
</schemaIncludes>
<bindings>
<binding>
<fileset>
<directory>${project.build.directory}/xjc-c/META-INF</directory>
<includes>
<include>sun-jaxb.episode</include>
</includes>
</fileset>
</binding>
</bindings>
</configuration>
</execution>
<execution>
<id>xjc-b</id>
<goals>
<goal>generate</goal>
</goals>
<phase>generate-resources</phase>
<configuration>
<generatePackage>test.b</generatePackage>
<generateDirectory>${project.build.directory}/xjc-b</generateDirectory>
<schemaIncludes>
<includes>b.xsd</includes>
</schemaIncludes>
<bindings>
<binding>
<fileset>
<directory>${project.build.directory}/xjc-c/META-INF</directory>
<includes>
<include>sun-jaxb.episode</include>
</includes>
</fileset>
</binding>
</bindings>
</configuration>
</execution>
</executions>
</plugin>
</plugins>
</build>
</project>
看似已经可见的图像,这意味着不透明度将从0-> 100变为淡入,从而导致闪烁。
如果您在fadeIn
例程中更改了以下行,则应该全部设置..
navigate_post
即。 navigate_post(l, type) {
...
container.find('.image').hide();
container.find('.image-' + imageToLoad).show();
return false;
}
- &GT; .fadeIn()