小编Ela*_*ley的帖子

在响应式图像上使用jcrop

由于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)

html css jquery jcrop responsive-design

16
推荐指数
1
解决办法
1万
查看次数

垂直对齐中间,显示表格单元格无法处理图像

我试图在布局上使用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/我创造了一个小提琴

css vertical-alignment css-tables

16
推荐指数
1
解决办法
7万
查看次数

Angular 2 - 预加载背景图片?

我有这个角度项目,我有一个填充页面的大背景图像和一个带有链接的简单侧边栏,点击后,将用另一个图像(来自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或类似的东西,以保持图像变化顺利给用户,而不是像现在一样跳跃.

javascript angular

11
推荐指数
3
解决办法
1万
查看次数

CakePHP 1.3 - where子句中的未知列

我正在开发一个已经存在的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)

php mysql sql cakephp cakephp-1.3

8
推荐指数
1
解决办法
2649
查看次数

Laravel MySQL如何以与whereIn子句相同的顺序排序结果

我有两个查询,第一个给我一个id数组,这是一个特定的顺序.然后我将这个ID数组传递给第二个查询,如下所示:

 Operation::whereIn('id', $ids)->get();
Run Code Online (Sandbox Code Playgroud)

但是当我输出该查询的结果时,顺序已经改变,如果数组$ ids类似于(4,2,6,9),这是我想要结果的顺序,输出将给我2 ,4,6,9.我怎么能避免这种情况?

mysql eloquent laravel-4

8
推荐指数
2
解决办法
4446
查看次数

Laravel blade - 如果满足条件,则添加一个类

这很简单,但我似乎无法用刀片做到这一点,我通常会回到php,但是,因为我不能用刀片声明一个新的php变量(没有打印它,就是这样)应该怎么做如果满足某个条件,我会更改一个简单的类名吗?以这个链接为例,我只想在$ hostess-> active = 1时添加"active"类

 {{ HTML::linkRoute('hostesses.index', 'Archived', $params, array('class' => 'btn btn-default')) }}
Run Code Online (Sandbox Code Playgroud)

我知道如何用PHP做到这一点,但如何用刀片完成​​呢?

php laravel blade laravel-4

7
推荐指数
4
解决办法
2万
查看次数

取消设置所有$ _POST变量,以便重定向时不会出现警告框

提交表单后,我有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)

如果我回复帖子没有显示任何内容,但每次重新加载时我都会再次收到浏览器警告.

php forms post

6
推荐指数
1
解决办法
3万
查看次数

当div移动以填充淡出的其他div所留下​​的空白空间时,如何为div设置动画

我有一组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/事情的小提琴

html jquery jquery-animate

6
推荐指数
1
解决办法
4759
查看次数

全屏视频不允许在Firefox上滚动

我正在使用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

javascript css firefox scroll mousewheel

6
推荐指数
1
解决办法
2600
查看次数

在绝对定位的父级内滚动 div

我有一个绝对定位的 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/

html css

6
推荐指数
1
解决办法
6618
查看次数