If you want to reload a page without trigger a message to the user asking if they want to send data again, you can use this:
window.location = window.location;
instead of:
window.location.reload();
If you want to reload a page without trigger a message to the user asking if they want to send data again, you can use this:
window.location = window.location;
instead of:
window.location.reload();
Clone your Heroku App GIT repo to a local server directory:
$ git clone git@heroku.com:yourapp-name-xxxx.git
Enable CURL extension in php.ini:
#Win env: extension=php_curl.dll
Clone Facebook PHP SDK into sdk/ folder. It’s included as a submodule, so do only:
git submodule init git submodule update
Alter AppInfo.php to return your App ID and App Secret:
/**
* @return the appID for this app
*/
public static function appID() {
//return getenv('FACEBOOK_APP_ID');
return 'YOUR_APP_ID_HERE';
}
/**
* @return the appSecret for this app
*/
public static function appSecret() {
//return getenv('FACEBOOK_SECRET');
return 'YOUR_SECRET_HERE';
}
Add lines to .gitignore:
AppInfo.php sdk/src/**/*
After watching Paul Irish‘s Tooling – JSConf slideshow, I decided to extract his rolling links CSS definition and examinate it.
Here it is:
<div id="reveal"> <a href="http://zsitro.com/" class=" roll"> <span data-title="H5BP build script">H5BP build script</span> </a> </div>
/*********************************************
* ROLLING LINKS
*********************************************/
#reveal .roll {
display: inline-block; /* give it a layout */
overflow: hidden;
vertical-align: top; /* just to be sure */
/*
* The smaller the number the closer you look at this element
*/
-webkit-perspective: 400px;
-moz-perspective: 400px;
-ms-perspective: 400px;
perspective: 400px;
/*
* Relative position of the POV
* Default is 50% 50% so not necessary
*/
-webkit-perspective-origin: 50% 50%;
-moz-perspective-origin: 50% 50%;
-ms-perspective-origin: 50% 50%;
perspective-origin: 50% 50%;
}
#reveal .roll:hover {
background: none;
text-shadow: none;
}
#reveal .roll span {
display: block; /* give it a layout */
position: relative;
padding: 0 2px;
pointer-events: none;
/* duration */
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-ms-transition: all 400ms ease;
transition: all 400ms ease;
-webkit-transform-origin: 50% 0%; /* posx posy */
-moz-transform-origin: 50% 0%;
-ms-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
/*
* CSS3 transform-style explained here:
* http://www.webkit.org/blog-files/3d-transforms/transform-style.html
*/
}
#reveal .roll:hover span {
background: rgba(0,0,0,0.5);
-webkit-transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg );
-moz-transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg );
-ms-transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg );
transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg );
}
/* ======================= */
/* = Face after rotation = */
/* ======================= */
#reveal .roll span:after {
content: attr(data-title);
display: block; /* maybe its not necessary */
position: absolute; /* position over */
left: 0;
top: 0;
padding: 0 2px; /* nothing functional, just right, left space */
color: #fff;
background: hsl(185, 60%, 35%);
-webkit-transform-origin: 50% 0%;
-moz-transform-origin: 50% 0%;
-ms-transform-origin: 50% 0%;
transform-origin: 50% 0%;
/*
* translate3d => move up element to the top
* rotateX => rotate till hidden
*/
-webkit-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
-moz-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
-ms-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
}
When I was on to make a default share photo for this site, I have made a research on the appropriate dimension for it.
I came across this:
// https://s-static.ak.fbcdn.net/rsrc.php/v2/yZ/r/7mFDR3G4sU9.css @ line: 967
.uiStreamBoulderThemeAgg
.uiStreamAttachments .external img {
max-height: 100px;
max-width: 120px;
}
It is totally okay to use & in HTML5 code without &.
HTML5: http://goo.gl/vpfte
XHTML 1.0 Transitional: http://goo.gl/oEkQl
Vincent! We happy?
Your LESS shortcut declaration won’t appear in the compiled CSS file as long as you attach a “declaration-variable” to it.
// This will be in the CSS output, but I use it only inside other declarations. That's wrong.
.removeMP{
padding:0;margin:0;
}
// This wont show up in the output, but provides the same functionality.
.removeMP(@foo:''){
padding:0;margin:0;
}
Recently I did a pull request into less.js, but the project owner (cloudhead) have already got 80+other requests so I publish here one solution for an issue in this framework:
When you call less.watch() in production environment or with the hash mark -> it just does not work. Feature or bug dunno. But:
Many people trying to do this:
<script type="text/javascript" src="less-1.2.2.js"></script> <script type="text/javascript"> // <![CDATA[ less.env = "development"; less.watch(); // ]]> </script>
but they do not realize that less.env line is ignored (because less.js loaded itself right before that line), and that variable is auto set up based on your URL (localhost/127.0.0.1,file:///,etc). Which is not always useful.
For example I work on localhost with a http://projects.local/... host name so there the less.watch() wont work.
I added a bit code to the browser.js.
https://github.com/zsitro/less.js/commit/696c9ec034b373c63e7e734d7ebb9b0be04e8ca0
EFFECT: less.watch() can be called from hash or from script tag even in production env.
Now this will function as follows:
<script type="text/javascript" src="less-1.2.2.js"></script> <script type="text/javascript"> // <![CDATA[ //less.env = "development"; ITS JUST DUMB less.watch(); // ]]> </script>
Also fixed: missing clearInterval @ less.unwatch(). Its weird that less.js does not kill the timer, but check the less.watchMode true/false in the loop :D
Hope you guys like it.
Anyway, after using less.js I switched to lessPHP. Its much faster and reliable, than the javascript compiler. I will write about it later.
You can remove or change the <ul> container that you get by default with wp_nav_menu (codex) through parameters, but you can’t remove the <li> elements that wrap each menu item. This is how you can actually remove them:
$menuParameters = array( 'container' => false, 'echo' => false, 'items_wrap' => '%3$s', 'depth' => 0 ); echo strip_tags(wp_nav_menu( $menuParameters ), '<a>' );
UPDATE: Chris Coyier made a repost here:
http://css-tricks.com/snippets/wordpress/remove-li-elements-from-output-of-wp_nav_menu/