我目前正在为一家公司开发移动登陆页面.这是一个非常基本的布局,但在标题下面有一个产品的图像,它总是100%宽度(设计显示它总是从边缘到边缘).根据屏幕的宽度,图像的高度显然会相应调整.我最初使用img(CSS宽度为100%)做了这个并且效果很好但是我意识到我想使用媒体查询来根据不同的分辨率提供不同的图像 - 比方说小,中等例如,同一图像的大版本.我知道你不能用CSS改变img src所以我想我应该使用CSS背景作为图像而不是HTML中的img标签.
我似乎无法正常工作,因为带背景图像的div需要宽度和高度来显示背景.我显然可以使用'width:100%',但我对高度有什么用？我可以像150px一样随机固定高度然后我可以看到图像的前150px,但这不是解决方案,因为没有固定的高度.我有一个游戏,发现一旦有高度(用150px测试),我可以使用'background-size:100%'来正确地将图像放入div中.我可以在这个项目中使用最新的CSS3,因为它仅针对移动设备.
我在下面添加了一个粗略的例子.请原谅内联样式,但我想给出一个基本的例子,试着让我的问题更清晰一些.
<div id="image-container">
<div id="image" style="background: url(image.jpg) no-repeat; width: 100%; height: 150px; background-size: 100%;"></div>
</div>
我是否可能必须根据整个页面给容器div一个百分比高度,或者我看到这个完全错误？
另外,你认为CSS背景是最好的方法吗？也许有一种技术可以根据设备/屏幕宽度提供不同的img标签.一般的想法是,着陆页模板将使用不同的产品图像多次,因此我需要确保以最佳方式开发.
我很抱歉这是一个有点啰嗦,但我从这个项目来回到下一个,所以我想完成这个小事.在此先感谢您的时间,非常感谢.问候
今天早上,我想我最后会把一个快速的Express应用程序放在一起看看Handlebars.到目前为止我很享受(我觉得我更喜欢Handlebars和Jade),但我有一个问题.我正在玩的应用程序是(又一个)使用Mongo的基本CMS.在/ posts/index页面上,我正在检查并显示帖子:
{{#if posts}}
{{#each posts}}
<h4>{{title}}
<p>{{content}}</p>
{{/each}}
{{else}}
<p>There are no posts.</p>
{{/if}}
这很简单并按预期工作,但我当时想知道在每个帖子的底部添加类似编辑按钮的内容.我想基于用户来调整这种可见性.如果登录(我正在使用Passport的本地策略),我可以通过以下方式轻松查看用户的详细信息:
{{#if user}}
{{user.name}}
{{/if}}
但问题是,我似乎无法得到那个,如果用户检查工作中的每一个上面.在Handlebars中这可能吗？在Jade过去,我刚刚使用了类似的东西:
if(posts.length)
each post in posts
#{post.title}
if(user)
...
为清楚起见,帖子页面的获取路径是:
router.get('/', function(req, res) {
Post.find({}, function(err, posts) {
res.render('posts/index', {
title: 'Posts',
user: req.user,
posts: posts,
});
});
});
如上所述,我对Handlebars很新,所以我希望这是非常明显的事情.在此先感谢,我希望你们都有一个伟大的NYE!
本周我决定学习Node.js(我不是程序员).到目前为止,我一直很开心,但我现在卡住了.
我使用Express创建了一个基本的应用程序.假设我有路线/位置.我设置我的get请求来呈现相关视图并找到(使用Mongoose的.find方法)我的位置模型中的所有文档.我知道我可以将文档传递给这样的视图:
app.get('/locations', function(req, res) {
Location.find({}, function(err, docs) {
res.render('locations/index', {
title: 'Locations',
user: req.user,
docs: docs
});
});
});
例如,我可以访问(Jade)视图中的结果并通过执行以下操作列出它们:
if(docs.length)
each location in docs
p #{location.name} is at #{location.coordinates}
我想将所有这些位置(使用与每个"位置"一起存储的坐标)添加到Google地图.我在视图中使用以下脚本显示了一个示例地图,该脚本来自Google Maps API文档.
function initialize() {
var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
var mapOptions = {
zoom: 4,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
}
var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
title: "Hello World!"
});
marker.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
我想到了标记变量的创建位置然后设置我可以遍历我的'docs'并为我的数据库中存储的每个位置创建和设置标记.也就是说,我太新了,我似乎无法弄清楚如何做到这一点,因为头部的脚本无法访问我传递给视图的'文档'.
有什么建议？在此先感谢,非常感谢.
我正在玩 Mongoose，但在保存到数组时遇到问题。例如，我在页面上有一个用于逗号分隔标签的输入字段。我从 req.body.tags 中获取这些内容，删除空格，然后用逗号分隔它们以获得标签数组。现在，如何将该数组保存回我的数据库？我猜我已经错误地设置了这部分架构，但说实话，我不确定什么是正确的。到目前为止我的架构是：
var postSchema = mongoose.Schema({
title: String,
permalink: String,
content: String,
author: {
id: String,
name: String,
},
postDate: {
type: Date,
default: Date.now
},
});
如果我要保存标签（例如，来自帖子），最好有一个名为标签的数组，然后每个标签都有一个名称（和ID？）？如果是这样，我是否会在架构中添加类似这样的内容（如下）？向帖子添加标签的想法是这样我可以在帖子上显示它们（作为链接），并能够在数据库中搜索具有特定标签的所有帖子。这是正确的做法吗？
tags: [{
name: String,
id: String
}]
当发布到新的发布路线时，我正在执行以下操作：
post = new Post(req.body);
tags = req.body.tags.replace(/\s/g,'').split(',');
// maybe post.tags = tags ?
post.save(function(err) {
if (!err) {
res.redirect('/posts');
} else {
...
}
});
这成功保存了提交的所有其他字段（标题、作者、内容等），但我不确定如何将新创建的标签保存回数据库。这里的任何建议都将非常受欢迎，因为我对此很陌生并且渴望继续学习。谢谢！