Tag: css

翻转文本超链接以成为图像

我怎样才能做到这一点? 是否有可能有一个文本超链接,一旦它hover,该文本链接成为一个图像? iv看过图像翻转,但还没有看到或知道如何编码文本到图像翻转。 我只是不知道从哪里开始和使用什么编程语言。 JavaScript的? PHP的? jQuery的? 我开始使用以下代码: Mouseover here 但它的作用是将图像保存在屏幕上,同时将图像加载到屏幕下方。 我希望文本完全摆脱图像。 有帮助吗? 非常感谢提前。

响应表但需要在resize时编辑几行样式

页面是这样的 现在resize它正在改变为这样的事情: 但是我需要最后两行来使用完整的空间,例如结果应该从电子邮件的下面开始,这种中心方法。 表Html是 Employe IdNameEmail 1XyZXyZ@gmail.comResult Output Error 2XyZ2XyZ@gmail.comResult Output Error 3RomonovXyZ@gmail.comResult Output Error jQuery是: ;(function ( $ ) { $.fn.ngResponsiveTables = function(options) { var defaults = { smallPaddingCharNo: 5, mediumPaddingCharNo: 10, largePaddingCharNo: 15 }, $selElement = this, ngResponsiveTables = { opt: ”, dataContent: ”, globalWidth: 0, init: function(){ this.opt = $.extend( defaults, options […]

使用精灵平滑CSS动画

我试图动画我的精灵,它与此类似。 如果有人能展示如何让它更顺畅,我将不胜感激。 我的精灵中只有3张图像。 延迟1秒,所以过渡非常糟糕。 我试过用: from { -webkit-transform: translateX(..); } to { -webkit-transform: translateX(..); } 但它没有用。 我真的很感激任何帮助。

重置这个jQuery动画

我试着看看 如何重置jquery动画重新开始? 但在这种情况下似乎没有用。 我试图通过在最后一个节目中添加函数作为回调来重新启动此动态动画 。 这工作,但重置动画对象没有。 我错过了什么? – 现在看来下面的代码确实有效 DEMO 码 jQuery Powered Kinetic Text Animation function animation() { // my attempt to reset $(‘.first’).removeAttr(‘style’); $(‘.second’).removeAttr(‘style’); $(‘.shadow1’).removeAttr(‘style’); $(‘.second .a’).removeAttr(‘style’); $(‘.second .b’).removeAttr(‘style’); $(‘.second .c’).removeAttr(‘style’); $(‘.third’).removeAttr(‘style’); $(‘.fourth’).removeAttr(‘style’); $(‘.fifth’).removeAttr(‘style’); $(‘.fifth .a’).removeAttr(‘style’); $(‘.fifth .b’).removeAttr(‘style’); $(‘.fifth .c’).removeAttr(‘style’); $(‘.fifth .d’).removeAttr(‘style’); $(‘.sixth’).removeAttr(‘style’); // end reset attempt // original code $(‘.first’).animate({right: ‘1500px’}, 3000); […]

单击时,Fancybox关闭按钮消失

我目前正在使用fancybox版本2.1.5,我遇到的问题是当我点击iframe上的关闭按钮“x”时,关闭按钮“x”消失而不是关闭iframe。 有没有其他人在使用fancybox时遇到此错误? 请访问此页面并单击“详细信息”,然后单击关闭按钮“x”以体验错误。 http://www.jerrellkbryant.com/jbcom/portfolio View Details Visit Website jQuery(document).ready(function(){ $(“.various”).fancybox({ type :’iframe’, scrolling : ‘no’, maxWidth : 800, maxHeight : 400, fitToView : true, width : ‘70%’, height : ‘70%’, autoSize : false, closeClick : true, openEffect : ‘none’, closeEffect : ‘none’, });

更改“with”属性更改样式

我有html看起来像这样: Click to open 我的JavaScript看起来像这样: function show() { vm.someProperty(vm.list[1]); $(“#hiddenDiv”).fadeIn(“slow”); } function hide() { $(“#hiddenDiv”).fadeOut(“slow”); } function colorCells() { $(“.cell”).css(“background-color”, “Yellow”); } function ViewModel() { this.list = [new SubModel(“item 1”), new SubModel(“item 2”)]; this.someProperty = ko.observable(this.list[0]); } function SubModel(msg) { this.message = msg; } var vm = new ViewModel(); $(function () { ko.applyBindings(vm); }); 我在这里设置了一个jsFiddle。 […]

一个接一个地改变多个div的颜色

我有一个问题一个一个地改变一些div的颜色。 在页面加载我创建一个div,其中填充了一个15×15 div的正方形(class =’feld’) 我想改变的所有div都有类feld 我的代码到目前为止: $(document).ready(function() { create(); var delay = 1; function create(){ for (z = 1; z < 16; z++) { var zeile = jQuery('’, { class: ‘zeile’, id: z, html: “” }); $(“#wortfeld”).append(zeile); for (s = 1; s < 16; s++) { var div = jQuery('’, { class: ‘feld’, id: s, […]

在移动铬和safari中看不见的元素

在此页面中,在通过jQuery应用类之后,#searchInput元素是不可见的。 我检查了它的可见性没有隐藏,它的不透明度不是0,它的显示不是没有。 我知道元素存在,因为当我将鼠标hover在开发工具中的代码上时,我会看到它的填充和边距。 这种情况发生在移动Chrome和Safari中,但不适用于桌面Chrome和Safari。 可以使用chrome dev工具复制桌面chrome中的问题来模拟移动设备。 以下是如何复制问题: 转到此页面: https : //googledrive.com/host/0BwJVaMrY8QdcMlJSU1J4RmZlSXc/KE_home.html 向下滚动,以便不再显示标题 向上滚动,但不够,以便标题重新进入视图。 应该使用.stickySearch类,它将被固定,并在桌面和移动设备中固定页面顶部; 但是,在移动设备中,它是看不见的。 这是添加类的JS代码: var lastScrollTop = 0; $(window).scroll(function(){ var st = $(this).scrollTop(); if(st235) $(‘#searchInput’).removeClass(‘slideBack’).addClass(‘stickySearch’); else $(‘#searchInput’).removeClass(‘stickySearch’).addClass(‘slideBack’); } else $(‘#searchInput’).removeClass(‘stickySearch’).removeClass(‘slideBack’); lastScrollTop = st; .slideBack没有与之关联的样式,买.stickySearch会: .stickySearch{ width:60% !important; position:fixed !important; left:0; right:0; top:32px !important; } @media only screen and (max-width:678px){ .stickySearch{ width:65% !important; } […]

向下滚动页面时如何使徽标出现在固定菜单中

在我的网站上我有一个菜单,当你向下滚动到100像素时,菜单将自己固定在浏览器的顶部(顶部:0px;位置:固定;)。 然而,我需要的是,当菜单处于其原始位置(顶部:100px;位置:相对)时,左侧菜单中的小徽标不显示,但当用户向下滚动页面并且菜单修复为浏览器窗口的顶部(顶部:0px;位置:固定;) 我的代码如下。 我试图做一个JSFiddle,但我不能复制我的html文件中的内容。 CSS #menu, #menu ul { margin: 0 auto; padding: 0; background-color: #FFFFFF; } #menu { display: table; width: 100%; list-style: none; position: relative; top: 0px; text-align: center; -webkit-box-shadow: 0px 3px 23px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 3px 23px 0px rgba(50, 50, 50, 0.75); box-shadow: 0px 3px 23px 0px rgba(50, […]

modal dialog – 如何通过滚动使模态的背景延伸100%?

我必须创建一个模态窗口,其中包含动态评估的输入字段(每次用户点击输入时,都会添加一个新的输入字段)。 我的问题是模态的背景不会根据模态的大小扩展 部分HTML: Basic Information Colour Theme Personal Expertise Professional Experience modal dialog中其中一个选项卡的输入元素示例: Personal Expertise Tourism types Select max. 5 types of tourism that you’re an expert in. 问题仅发生在小于15英寸的屏幕上