由于jcrop现在正在使用触摸屏,我想做一个使用它的网络应用程序.我有一切工作,但如果我尝试使设计响应,以便用户可以在裁剪之前看到整个图像(它的宽度是屏幕的百分比),那么裁剪区域将不会与选择的相同用户.在调整大小后的图像上进行的选择坐标与全尺寸图像上的坐标不匹配.
Jcrop通过使用box大小调整或truesize方法包含类似问题的解决方案(当处理大图像时),但如果图像的宽度基于百分比而不是给定的像素宽度,则它们都不起作用.
我能想到的唯一解决方案是使用媒体查询调整图像大小,并根据屏幕的宽度制作3或4个版本,但我宁愿坚持基于百分比的调整大小,因为它看起来好多了.
这是我的jcrop电话:
var jcrop_api, boundx, boundy;
$('#target').Jcrop({
onChange: updatePreview,
onSelect: updatePreview,
aspectRatio: 0.75
},function(){
// Use the API to get the real image size
var bounds = this.getBounds();
boundx = bounds[0];
boundy = bounds[1];
trueSize: [900,600],
// Store the API in the jcrop_api variable
jcrop_api = this;
});
function updatePreview(c){
if (parseInt(c.w) > 0){
var rx = <?echo $width;?> / c.w;
var ry = <?echo $height;?> / c.h;
$('#preview').css({
width: Math.round(rx * boundx) + 'px',
height: Math.round(ry * …Run Code Online (Sandbox Code Playgroud) 我试图在布局上使用vertical-align:middle有时垂直居中文本,有时是图像,但它只适用于文本.谁能告诉我为什么?
HTML:
<div>
<img src="http://jsfiddle.net/img/logo.png"/>
</div>
<div>
<span> text </span>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS:
div{
width:200px;
height:200px;
background-color:red;
display:table;
margin:10px;
}
img, span{
display:table-cell;
vertical-align:middle;
}
Run Code Online (Sandbox Code Playgroud)
http://jsfiddle.net/9uD8M/我创造了一个小提琴
我有这个角度项目,我有一个填充页面的大背景图像和一个带有链接的简单侧边栏,点击后,将用另一个图像(来自cdn)更改背景的URL.由于这些图像相当大,它们需要一两秒才能加载并且它很明显,我想添加一个预加载器,但我不确定如何在角度2中完成.
在我的HTML中我有这个:
<section class="fullsizebg image-bg" [ngStyle]="{'background-image': 'url(' + urlImage + ')'}"></section>
Run Code Online (Sandbox Code Playgroud)
变量urlImage填充在组件的构造函数中,侧边栏链接在单击时更改它的值,使用一个简单的函数,如下所示:
generateImage(data: any){
this.urlImage = 'http://example.com/mycdn/'+this.data.url+'.jpg';
}
Run Code Online (Sandbox Code Playgroud)
因此,网址实际上会立即更改,但图像需要加载一些.我想添加一个加载gif或类似的东西,以保持图像变化顺利给用户,而不是像现在一样跳跃.
我正在开发一个已经存在的cakephp 1.3项目,我需要在数据库中添加一个新表.我在我的控制器中有这个:
$conditions = array('ShootingPlacement.person_id' => $id, 'Email.person_id' => $id, 'Email.shooting_placement_id' => 'ShootingPlacement.id');
$shootingPlacements = $this->ShootingPlacement->find('all', compact('conditions'));
Run Code Online (Sandbox Code Playgroud)
它给了我这个错误:
Warning (512): SQL Error: 1054: Unknown column 'Email.person_id' in 'where clause' [CORE/cake/libs/model/datasources/dbo_source.php, line 684]
Run Code Online (Sandbox Code Playgroud)
这是它试图创建的查询:
SELECT `ShootingPlacement`.`id`, ... FROM `shooting_placements` AS `ShootingPlacement`
LEFT JOIN `people` AS `Person` ON (`ShootingPlacement`.`person_id` = `Person`.`id`)
LEFT JOIN `shootings` AS `Shooting` ON (`ShootingPlacement`.`shooting_id` = `Shooting`.`id`)
WHERE `ShootingPlacement`.`person_id` = 123688 AND `Email`.`person_id` = 123688 AND `Email`.`shooting_placement_id` = 'ShootingPlacement.id'
ORDER BY `lastname` ASC
Run Code Online (Sandbox Code Playgroud)
显然我的控制器代码是错误的,但我不确定如何将电子邮件表与ShootingPlacement表关联起来.我认为我的模型是正确的.到目前为止,如果我有这个:
$conditions = array('ShootingPlacement.person_id' => $id); …Run Code Online (Sandbox Code Playgroud) 我有两个查询,第一个给我一个id数组,这是一个特定的顺序.然后我将这个ID数组传递给第二个查询,如下所示:
Operation::whereIn('id', $ids)->get();
Run Code Online (Sandbox Code Playgroud)
但是当我输出该查询的结果时,顺序已经改变,如果数组$ ids类似于(4,2,6,9),这是我想要结果的顺序,输出将给我2 ,4,6,9.我怎么能避免这种情况?
这很简单,但我似乎无法用刀片做到这一点,我通常会回到php,但是,因为我不能用刀片声明一个新的php变量(没有打印它,就是这样)应该怎么做如果满足某个条件,我会更改一个简单的类名吗?以这个链接为例,我只想在$ hostess-> active = 1时添加"active"类
{{ HTML::linkRoute('hostesses.index', 'Archived', $params, array('class' => 'btn btn-default')) }}
Run Code Online (Sandbox Code Playgroud)
我知道如何用PHP做到这一点,但如何用刀片完成呢?
提交表单后,我有2个$ _POST变量.在目标网页中,我想将它们转换为$ _SESSION变量并取消设置$ _POST变量,以便用户不会收到浏览器再次发送数据的警报.这是我的(不工作)代码:
if(isset($_POST['clave']) && isset($_POST['email'])){
$_SESSION['id_user']=$_POST['clave'];
$_SESSION['email']=$_POST['email'];
}
if(isset($_SESSION['id_user']) && isset($_SESSION['email'])){
unset($_POST['clave']);
unset($_POST['email']);
//I do my stuff here
}
Run Code Online (Sandbox Code Playgroud)
如果我回复帖子没有显示任何内容,但每次重新加载时我都会再次收到浏览器警告.
我有一组div,每个div对应一组类别.当我点击一个过滤器时,这将改变div的类,并根据这些类别使它们变得易碎或隐藏.我控制div如何淡入/淡出并且它们缓慢而漂亮但每次div消失时,保持不变的那些突然移动以填充被隐藏的空间留下的空白空间.
如何在其他人消失并留下空白空间之后平滑未隐藏的div的移动?
//Before this goes a long function that decides wich divs will get their class changed
$('#work-container > div[class*=visible]').fadeIn('slow','swing');
$('#work-container > div[class*=hidden]').fadeOut('slow','swing');
Run Code Online (Sandbox Code Playgroud)
编辑:http://jsfiddle.net/Ccswn/3/事情的小提琴
我正在使用fullscreen.js脚本,在我的一个屏幕中,我将有一个全屏Vimeo视频.显然这会导致FF出现问题,并且一旦我到达带有视频的屏幕,就会阻止我向上或向下滚动.问题已提交到脚本的GitHub页面,但作者认为它是一个FF问题(https://github.com/alvarotrigo/fullPage.js/issues/803).
我正在使用所有这些基础CSS来响应视频:
<div class="flex-video widescreen vimeo">
<iframe src="<?php the_sub_field('video') ?>"
width="400"
height="225"
frameborder="0"
webkitAllowFullScreen
mozallowfullscreen
allowFullScreen></iframe>
</div>
Run Code Online (Sandbox Code Playgroud)
这个错误就是这个:https://bugzilla.mozilla.org/show_bug.cgi?id = 779286但是我没有看到它在Mac上的FF 36上得到了解决.铬也没有发生这个问题.
以下是GitHub线程中其他人的问题示例:http://jsbin.com/tunove/1/edit?html,output
我有一个绝对定位的 div,里面有另一个 div,其内容大于父级。我需要子 div 具有垂直滚动,但我的尝试不起作用。我需要在没有js的情况下做到这一点。这是我的代码:
HTML:
<div class="container">
<div class="allow-scroll">
---CONTENT---
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS:
.container{
background: red;
position: absolute;
top:0;
left:0;
right: 50%;
bottom: 50%;
overflow: hidden;
}
.allow-scroll{
overflow-y: scroll;
position: relative;
height: 100%:
}
Run Code Online (Sandbox Code Playgroud)
还有一把小提琴: https: //jsfiddle.net/zasnj08z/