我试图找到解决方案,但不能.我需要Pinterest(Pin It)按钮的自定义图像,并通过URL固定一些自定义图像,但不是当前页面.
我创建了一个自定义链接:
<a href="http://pinterest.com/pin/create/button/?url=http://inspired-ui.com&media={ImageURL}&description=DescriptionText" class="pinitbutton">Pin It</a>
Run Code Online (Sandbox Code Playgroud)
在风格我设置背景图像,但我只看到默认的Pin It按钮,而不是我的自定义按钮
在某些解决方案中,您可以为Pin It按钮设置自定义按钮图像,但我无法在这些解决方案中更改media = {ImageURL}.
流行的解决方案是
<a href='javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)());'><img src='http://www.brandaiddesignco.com/blog/PinIt.png'/></a>
Run Code Online (Sandbox Code Playgroud)
但它对我没有帮助.有人知道解决方案吗?
我background-attachment:fixed的工作正常.但是当我在那个DIV上定义CSS3旋转并向下滚动然后background-attachment:fixed停止工作.
检查这个http://jsfiddle.net/P3jS4/
现在我正在研究chrome18.
当你删除旋转css然后后台附件:修复工作正常.
我在为层次结构显示提供CSS时遇到了麻烦,比如文件和文件夹树.我使用嵌套的无序列表:
<ul>
<li>animals<ul>
<li>dogs</li>
<li>cats</li>
</ul></li>
</ul>
Run Code Online (Sandbox Code Playgroud)
它们与正确的CSS减去连接线很好地显示.我需要连线.我使用以下CSS执行此操作:
ul ul li:before {
content: "";
padding: 15px;
border: 1px solid #000;
border-width: 0 0 1px 1px;
border-radius: 0 0 0 10px;
position: absolute;
left: -22px;
top: -15px;
}
Run Code Online (Sandbox Code Playgroud)
问题是线条与动物,狗和猫的图标重叠.我尝试将z-index更改为无效.有没有更好的方法来实现这个CSS?还是有另一种方法让z-index有意义吗?
我希望使用CSS和jQuery绘制一个财富之轮.我不想使用任何图像.
此外,我希望在圆圈中至少有8个段,并在每个段中正确对齐每个文本词.这是一张照片来说明:

一旦我有这个工作,我就可以使用CSS3 rotate财产.
不知道怎么能这样做?
为了我的游戏需要,我需要有2D声音.这意味着,发射器应位于2D平面上的某个位置.如何在Javascript中实现此效果?我需要使用特殊的声音格式还是可以控制扬声器的音量?
我想我可以达到每个扬声器有2个音量的程度,但我对如何在Javascript中为同一个声音应用不同音量感到无能为力.
我有一个简单的textarea,我需要制作透明字母,同时允许文本插入符号可见.当我应用以下规则时,我会得到隐形插入符号:
textarea {
background: transparent;
opacity: 0;
}
Run Code Online (Sandbox Code Playgroud)
当我输入不可见的文本时,我需要看到text-caret移动.
编辑:我需要编辑编辑表格中的td单元格.当我点击一个单元格时,我会显示一个textarea并开始输入.在每个字母上,我在单元格中插入一个上下文.在那之后,我隐藏了一个textarea.
我使用绝对定位将几个图像放在彼此的顶部.这些图像是部分透明的,并且具有html area并且map仅使可见部分可点击.在jQuery中,我将鼠标事件附加到area标签上.
这适用于一个图像:只有在输入图像的映射部分时才会触发mouseenter和mouseleave.
问题是它只适用于顶部图像.对于所有其他人来说,它不会触发事件而不是CSS悬停工作,因为它上面还有另一个图像.尽管事实上areas不重叠并且maps在图像的前面.
以下是该问题的演示:http://markv.nl/stack/imgmap2/
好吧,这个问题给我带来了很多问题.
将css3 -webkit-transform样式与任何类型的3d旋转(例如rotateY(30deg))一起使用时,将click事件绑定到此旋转对象是极不可靠的.
请参阅下面的示例代码或查看此小提琴(要查看小提琴中的不可靠性,请单击元素的右侧).此示例没有动画但仍受影响.
HTML:
<div id='box1'>Click this box.</div>
Run Code Online (Sandbox Code Playgroud)
CSS:
#box1{
-webkit-transform: rotateY(30deg);
}
Run Code Online (Sandbox Code Playgroud)
jQuery的:
$('#box1').click(function(){
alert('clicked box 1');
});
Run Code Online (Sandbox Code Playgroud)
我的意思是'不可靠'是不会总是抛出click事件(取决于你点击它的位置),有时事件根本不会被抛出(无论你在哪里点击它).
有没有办法解决或避免这种情况,以便旋转和动画时它与CSS3元素一起使用?
更新:
在元素上使用CSS属性"float:left"似乎允许它在不运动时正确检测点击事件.有谁知道为什么浮动属性修复了这个?
我的最终目标是让对象在运动时接收点击事件,但是,当我应用新的CSS3 rotate3d属性(实时,在另一个jquery事件上)给出对象动画时,click事件再次开始失败.
我正在登录屏幕上工作,我需要让它全屏运行.
我正在尝试将表单放在用户名之上,而且只是我没有得到正确的位置
这是一个例子:http: //jsfiddle.net/TSbRY/
#loginbackground{
width:100%;
height:100%;
position:fixed;
top:0px;
left:0px;
background: url(http://ivojonkers.com/loginscreentemp.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
}
#loginbackground form{
width:18.667%;
height:7.466%;
position:absolute;
top:51.4%;
left:50%;
margin-left:-8.867%;
}
#loginbackground input{
width:100%;
height:31.25%;
background-color:#F00;
border:none;
font:Georgia, "Times New Roman", Times, serif;
font-size:18px;
position: absolute;
}
Run Code Online (Sandbox Code Playgroud)
我的问题是我希望将表单放在用户名和pas上,并在每个屏幕分辨率下都存在,所以当你缩放浏览器时,你需要将表单放在你认为可以输入img的部分的顶部.
你可以在全屏幕上看到灰烬http://fiddle.jshell.net/TSbRY/show/它适合某些屏幕分辨率但不适用于所有屏幕分辨率
我需要让图像在div中水平并排显示.我怎样才能做到这一点?
HTML:
<div class="Wrapper">
<img src="/wp-content/uploads/2012/07/TFT.png" alt="Smiley face" height="90" width="95" />
<img src="/wp-content/uploads/2012/07/Ltyt.png" alt="Smiley face" height="90" width="95" />
<img src="/wp-content/uploads/2012/07/artspng" alt="Smiley face" height="90" width="95" />
</div>
Run Code Online (Sandbox Code Playgroud)
参考:jsFiddle