小编Sea*_*nWM的帖子

我正在使用Magnific Popups ajax popup创建一个类似于Instagram或Facebook的弹出式体验(左侧图片,右侧评论等).我如何设置整个灯箱的最大高度,并使图像在垂直居中时居中？这需要在所有浏览器中工作,并且必须具有响应性,这很棘手.我似乎无法让它在所有浏览器中正常工作.我想我不介意jQuery解决方案,因为这是我可能需要的.

图像和内容如下:

.image_container, .content {
    width: 50%;
    float: left;
}

并且只需使用媒体查询减少屏幕大小即可清除浮动.

我已经做了一个jsfiddle来帮助理解我想要解释的内容:

的jsfiddle

尝试重新调整iframe的大小以检查效果.

我有一个固定的列表和网格，使用react-window、infinite loader和auto sizer。它工作正常，但我希望在列表/网格开始之前附加一个组件（例如，搜索框和按钮）。实现这一目标的正确方法是什么？我希望这个组件与固定列表一起滚动而不是单独滚动。我之前只是渲染组件已经厌倦了，但是它不在固定列表容器中并且不会随它滚动。

{/* WANT TO ADD SOME SORT OF COMPONENT HERE SO IT CAN SCROLL WITH LIST */}
{/* CAN'T IN HERE BECAUSE ITS NOT INSIDE THE FIXED CONTAINER SO IT SCROllS SEPARATELY */}
<AutoSizer>
    {({ height, width }) => (
        <InfiniteLoader
            isItemLoaded={index => index < stateData.data.length}
            itemCount={stateData.data.length + 1}
            loadMoreItems={loadMoreProducts}
        >
            {({ onItemsRendered, ref }) => (
                <FixedSizeList
                    onItemsRendered={onItemsRendered}
                    ref={ref}
                    height={height}
                    itemCount={stateData.data.length + 1}
                    itemSize={350}
                    width={width}
                >
                    {/* WANT TO ADD SOME …

我的 jQuery 幻灯片有问题，我似乎无法弄清楚。在图像转换期间，幻灯片将闪烁白色，而不是很好地淡入下一张图片。我相信这与以下代码行有关：

$('#slideshow img:first').fadeOut(1000).next().fadeIn(1000).end().appendTo('#slideshow');

单击上一个和下一个按钮会导致相同的问题。

这是幻灯片的 jsFiddle。

谢谢！

我正在使用Magnific Popups ajax popup创建一个类似于Instagram的弹出式体验(左侧图像,右侧评论等).我试图弄清楚如何使左右内容框始终保持相同的高度.如果右侧的图像太大,它将恰好适合div,因为它应该是响应的.此外,如果整个浏览器变小(可能在移动设备上),图像将显示在顶部,内容显示在底部.

图像和内容如下:

.image_container, .content {
    width: 50%;
    float: left;
}

并且只需使用媒体查询减少屏幕大小即可清除浮动.

我已经做了一个jsfiddle来帮助理解我想要解释的内容:

的jsfiddle

如果您点击"打开"并调整iframe的大小,您将看到我想要的效果.

那么视图容器如何设置大小,左右内容区域的高度始终相同？只是看一下这个例子就可以看出它看起来有点滑稽了.

编辑

我也试过垂直居中图像,这似乎也是一个挑战.我已经尝试让css显示一个表格单元格,然后尝试,vertical-align: middle但这并没有结束工作.

该解决方案应适用于所有现代浏览器.

我试图在从组合框选项中选择不同的值时显示文本字段.

html文件

<select id="topic_type" onchange="func_type()">
    <option id="d"> D</option>
    <option id="o">O</option>
</select>

<script type="text/javascript">
function func_type() 
{
    var elem = document.getElementById("topic_type");

    if(elem.value == "D") 
    {
        document.getElementById("form_d").style.visibility = "visible";
        document.getElementById("form_o").style.visibility = "hidden"; 
    } 
    else if(elem.value == "O")
    {
        document.getElementById("form_o").style.visibility = "visible";
        document.getElementById("form_d").style.visibility = "hidden";
    }
}
</script>

这段代码工作正常.但我的问题是表单只是隐藏所以需要空间即.当我选择不同的选项文本字段出现但由于隐藏的表单有一个空格是有任何选项,我可以删除该空间

我一直采用内联onclick方法:

<a href="#" id="do-something" onclick="doSomething(<?= $row['id'] ?>); return false;">

但我注意到这不是大多数网站所做的.他们倾向于这样做:

<a href="#" id="do-something">

$("#do-something").click(function(e) {
    e.preventDefault();
    doSomething();
    // --------^
})

唯一的问题是,如何获得我在示例一中提供的参数,以便我可以在示例二中使用它？什么是正确的过程？也许添加一些隐藏的div？

我还要补充一点,我正在mysql考虑扩展.我知道mysqli或PDO应该使用.如果我使用jQuery Validation来验证客户端(例如电子邮件),我是否也应该在服务器端执行(确保它不是空白且是有效的电子邮件)？

我只是想知道我是否通过简单地不验证服务器端来打开跨站点脚本漏洞或SQL注入或其他任何问题,或者只要我在表单数据时采取安全措施,我就会好起来正在提交.

我从文本文件中读入并分配变量，就好像它们是带有列表的数组一样。我通过在换行符上爆炸来做到这一点。

但是，我还想修剪输入两侧的任何空白。根据我的理解和测试，这正是 trim() 所做的。

我想缩短它，以便它减少重复和更容易阅读。

$config = file_get_contents('scripts/secure/config.txt');  
list($host, $dbname, $username, $password) = explode ("\n", $config);

$host = trim($host); 
$dbname = trim($dbname); 
$username = trim($username); 
$password = trim($password);  

我尝试了几种不同的方法，但似乎都不起作用。我上面的方法确实有效，但我正在寻找一种单行方法。

我发现了这些提示

<select id="title">
          <option value="1">Mr</option>
          <option value="2">Mrs</option>
          <option value="3">Miss</option>
        </select>

现在用户已选择第二个选项:Mrs. To获取值(在本例中为'2'):

$("select#title").val(); 

一切都好.我想要做的是追加 $("select#title").val(); 到像这样的URL

 $.get('http://localhost/Symfony/web/app_dev.php/select/2', function(data)

代替2我试过,$.get('http://localhost/Symfony/web/app_dev.php/select/ $("select#title").val()', function(data) 但这失败了.有什么想法吗？

<div id="teln_operatorbundle_centrextype">
<div>
<label class="required" for="teln_operatorbundle_centrextype_numberrange">Numberrange</label>
<select id="teln_operatorbundle_centrextype_numberrange" multiple="multiple" required="required" name="teln_operatorbundle_centrextype[numberrange][]">
<option value="2">060013000</option>
<option value="3">060014700</option>
</select>
</div>
<input id="teln_operatorbundle_centrextype__token" type="hidden" value="f239bb430b4153d5d88fc7234751039a73253e87" name="teln_operatorbundle_centrextype[_token]">
</div>