我正在使用SwipeView(http://cubiq.org/swipeview)在触摸屏设备上创建可滑动的幻灯片.这对图像来说很简单,但我想在幻灯片中加入Vimeo视频.不幸的是,因为iFrame的捕捉你刷卡输入自己(我相信这是发生了什么,至少发生),一旦你在视频播放幻灯片,除非你的分页挖掘你再也不能刷卡远离它来了.这是不可接受的.
我的解决方案是在页面的某处隐藏视频(使用display:none;或者height:0;或者其他任何工作),并使用幻灯片中的图像和触发视频播放的点击事件.即使视频被隐藏,当它播放时它应该全屏播放(至少在iPhone上).
当我在桌面浏览器上测试它时,这项技术运行正常,但它在iPhone上表现得很奇怪.出于测试目的,视频显示在幻灯片下方.如果我加载页面并点击幻灯片,它什么都不做.但是,如果我通过点击实际的视频播放器播放视频,一旦视频关闭,我可以通过点击幻灯片再次播放视频.基本上,一旦通过播放器播放视频,我就可以通过API播放视频,但不能先使用播放器.
这是我的代码:
// Append the "hidden" video player to the page
$('.slider-container').append("<div class='mobile-video-slide'><iframe id='slideshow-player' src='//player.vimeo.com/video/81295681?title=0&byline=0&portrait=0&color=8bd4ee&api=1&player_id=slideshow-player' width='500' height='281' frameborder='0' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>");
// Get the player object
var iframe = $('#slideshow-player')[0],
player = $f(iframe);
// When the video is ready
player.addEvent('ready', function() {
// Add the click event to the slide
$('#play-video').on('click', function() {
// Play the video
player.api('play');
// Don't jump the page
return false;
});
});
Run Code Online (Sandbox Code Playgroud)
我已经通过测试确定了player.ready事件正常工作,并且图像的点击事件正常工作.问题似乎完全在于player.api('play')电话中.任何帮助,或实现这一点的替代方法将不胜感激.
我知道这个标题有点奇怪,但我会到达那里.
我有一台相机连接到笔记本电脑.使用遥控拍摄,当摄影师拍照时,它会被保存到笔记本电脑硬盘上的文件夹中.在文件夹上设置了Automator(Mac OS X)操作,无论何时出现新文件,它都会调整大小并使用Transmit将其推送到FTP.
这是代码的来源.
我有一个显示最近拍摄照片的网页.它使用ajax重复检查是否已上传新文件,如果有,则加载新照片并将其与旧照片交叉淡入淡出.这是页面上运行的Javascript.
(function() {
var delay, refreshLoop;
// Alias to setTimeout that reverses the parameters, making it much cleaner in code (for CoffeeScript)
delay = function(time, callback) {
return setTimeout(callback, time);
};
// Function that drives the loop of refreshing photos
refreshLoop = function(currentFolderState, refreshRate) {
// Get the new folder state
$.get("ajax/getFolderState.php", function(newFolderState) {
// If the new folder state is different
if (newFolderState !== currentFolderState) {
// Get the newest photo
$.get("ajax/getNewestPhoto.php", function(photoFilename) { …Run Code Online (Sandbox Code Playgroud) 我在导出/导入模块方面的所有经验都来自使用export和的ES6中import,您可以在其中执行类似的操作,以使单个模块导出默认函数以及单独的命名函数。
// module.js
export default mainFunction
export { namedFunction }
// main.js
import mainFunction from 'functions'
mainFunction()
import { namedFunction } from 'function'
namedFunction()
Run Code Online (Sandbox Code Playgroud)
但是我不知道如何使用module.exports和使用ES5样式导入来做到这一点require。据我了解,我可以导出一个默认值:
// module.js
module.exports = function mainFunction() {}
// main.js
const mainFunction = require('module.js')
Run Code Online (Sandbox Code Playgroud)
或者我可以创建命名的导出:
// module.js
module.exports = {
namedFunction: function() {}
}
// main.js
const namedFunction = require('module.js').namedFunction
Run Code Online (Sandbox Code Playgroud)
但是我不能两者都做。我以为可以这样命名出口之一“默认”,但它不起作用
// module.js
module.exports = {
default: function() {},
namedFunction: function() {}
}
// main.js
const mainFunction = …Run Code Online (Sandbox Code Playgroud) 我正在制作一个实时照片流应用.基本上,用户将通过FTP将照片上传到我的服务器上的文件夹,并且只要添加新照片而不刷新,页面就会更新.
我打算用AJAX和这个线程中建议的方法来做这个:如何用PHP检查目录内容是否已经改变?.基本上,我想在我的页面上每隔X秒进行一次循环,对一个PHP页面进行AJAX调用,该页面返回上传文件夹目录列表的MD5哈希值.如果自上次调用后哈希值发生了变化,则另一个AJAX调用将获得最近添加的文件,jQuery将在页面上显示它.
在vanilla Javascript/jQuery中,这可以使用一个带有setTimeout的递归命名函数来完成.这段代码对我有用:
function refreshLoop(currentFolderState, refreshRate) {
// Get the new folder state
$.get("../ajax/getFolderState.php", function(data) {
// If it's different than the current state
if ( data !== currentFolderState ) {
// Do something
}
// If it's the same as the current state
else {
// Do nothing
}
// After the refresh rate, try again
setTimeout(function() {
refreshLoop(data, refreshRate);
}, refreshRate);
});
}
// Document Ready
$(function() {
var refreshRate = 5000;
// After refresh …Run Code Online (Sandbox Code Playgroud) 我一直在开发移动优先网站,并发现我的媒体查询在Chrome for iOS中无法正常运行.似乎无论我使用什么尺寸的设备(iPhone,iPad)以及我查看它的方向,该页面都显示了基线(移动)样式和"481px以上"样式的混合版本.我上传了一个小屏幕截图(包含说明)来说明这个问题.
您可以在http://dev.thesmackpack.com上查看该页面.如果有任何你可以通过在那里探索可以学习的东西,CSS是不明确的.媒体查询在我测试过的每个其他浏览器中都能正常运行,只有Chrome for iOS正在给我这些问题.
编辑:它似乎在我发现测试的其他一些设备上正常工作.但是我无法在我的iPhone和iPad上进行UN-break,而这些是我正在开发网站的设备,所以这个问题仍然存在问题.
我对我正在开发的网站有疑问.它是一个数据库驱动的目录站点,人们可以在一个或多个区域代码和一个或多个工作领域中创建一个配置文件并列出自己.当某人正在寻找雇用的人时,他们会输入一个或多个区号来查看(或选中带有复选框),当表单提交时,它会将这些保存为cookie,以便网站记住您在搜索的位置.然后,您可以按类别和字段(即链接)缩小搜索范围,并获取与您的搜索匹配的所有配置文件的列表.
我关心的是:因为搜索引擎无法输入或选择要搜索的区号,如何查找和索引任何个人资料页面?它不允许用户在没有首先选择区号的情况下搜索人,因为这样做没有实际意义.从用户体验/可用性的角度来看,仅仅将每个区域代码的列表作为类别页面的链接也没有实际意义,但据我所知,这不是搜索引擎看到的唯一方式每个人?
Facebook这样的网站如何实现这一目标?没有某种主目录链接到单个Facebook用户的个人资料页面,但它们通常是一个人姓名的第一搜索结果.
我正在使用MediaElement.js作为正在进行中的网站的HTML5视频播放器.它在Chrome,Safari和Firefox中运行良好,即使使用了后备播放器,但在Internet Explorer中我看到了Javascript错误:http://d.pr/Jsfo.它似乎没有加载我的海报,或我的播放器风格(在其他浏览器中工作正常).
播放器的代码是动态加载的,因为它出现在灯箱中,并且有多个视频可以在页面上播放.注入HTML的Javascript位于页面底部
您可以在http://mindsmack.ryangiglio.com上查看开发站点
javascript ×5
ios ×2
jquery ×2
ajax ×1
coffeescript ×1
css3 ×1
dynamic ×1
ecmascript-5 ×1
froogaloop ×1
node-modules ×1
node.js ×1
php ×1
seo ×1
sitemap ×1
swipeview ×1
vimeo-player ×1