style collapser

home.php

@@ -7,10 +7,9 @@
  */
 
 get_header(); ?>
-<script type="text/javascript" src="http://opencounter.org/wp-content/themes/opencounter/scripts/jquery-1.3.min.js"></script>
 <script type="text/javascript" src="http://opencounter.org/wp-content/themes/opencounter/scripts/thinbox2.js"></script>
 <script type="text/javascript">
-$(document).ready(function(){
+jQuery(document).ready(function(){
     if(Cookies.get("betachip") != "eaten"){
 	ThinBox.open("betawindow.html",{'width':'500px','height':'350px'});
         Cookies.set("betachip", "eaten", { expires: 21 * 24 * 60 * 60 });

plugins/adjustly-collapse/aj-collapse.css

@@ -0,0 +1,3 @@
+.aj-collapse { cursor: pointer; }
+.aj-hidden { display: none; visibility: hidden; }
+.aj-visible { display: block; visibility: visible; }

plugins/adjustly-collapse/aj-collapse.js

@@ -0,0 +1,103 @@
+jQuery.noConflict();
+
+
+
+jQuery(document).ready(function(){
+/*
+ * jQuery scrollToShow plugin v0.1
+ *
+ * Copyright (c) 2010 Rob Brackett, [email protected] (http://robbrackett.com/)
+ * Licensed under the MIT license.
+ * 
+ * 
+ * Scrolls the window to either show all of a node or, if the node is taller 
+ * than the window, to the top of the node.
+ * 
+ * Automatically uses the first node of a jQuery set.
+ * Optionally call the static $.scrollToShow(node) with a DOM node instead.
+ */
+
+(function($) {
+	/**
+	 * Scroll to show the first element of a jQuery set.
+	 * @param {String} [speed=500] The duration of the scrolling animation
+	 * @param {Number} [pad=20] Space to leave above the element
+	 * @param {Function} [callback] Callback to invoke after the scrolling is done
+	 */
+     console.log($);
+	$.fn.scrollToShow = function(speed, pad, callback) {
+		if (this.length) {
+			$.scrollToShow(this[0], speed, pad);
+		}
+		return this;
+	};
+
+	/**
+	 * Scroll to show a DOM node
+	 * @param {HTML Element} node The DOM node/HTML element to scroll to
+	 * @param {String} [speed=500] The duration of the scrolling animation
+	 * @param {Number} [pad=20] Space to leave above the element
+	 * @param {Function} [callback] Callback to invoke after the scrolling is done
+	 */
+	$.scrollToShow = function(node, speed, pad, callback) {
+		pad = pad || 20;
+		speed = speed || 500;
+		var ht   = node.offsetHeight,
+		    top  = $(node).offset().top,
+		    wHt  = $(window).height(),
+		    dest = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop || 0;
+
+		// Scroll up if below the top of the node
+		if (dest > top - pad) {
+			dest = top - pad;
+		}
+		// Scroll down if node bottom is below window bottom
+		else if (dest + wHt < top + ht) {
+			if (pad + ht > wHt) {
+				// window can't contain node, scroll top of node
+				dest = top - pad;
+			}
+			else {
+				// Put the bottom of the node at the bottom of the window
+				dest = top + ht - wHt;
+			}
+		}
+		else {
+			return;
+		}	
+		$([document.body, document.documentElement]).animate({scrollTop: dest}, speed, callback);
+	};
+
+})(jQuery);
+
+
+
+
+
+
+
+		/*	here we loop through and hide any element
+			which has the classname .aj_hidden
+		*/
+		jQuery(".aj-hidden").hide();
+		/*	now that the element is hidden, we add a
+			class which tells it to set its visibility 
+			to visible.
+			
+			We do this because we set the visibility
+			of any aj_hidden to "hidden" in our CSS.  
+			This helps prevent the contents of any collapsible
+			element from being visible for a spilt second
+			during the initial page load.
+		*/
+		jQuery(".aj-hidden").addClass("aj-visible");
+		jQuery(".aj-collapse").click(function() {
+		  rel = jQuery(this).attr('rel');
+          setTimeout( function(){
+            //window.scrollBy(0, document.getElementById(rel).offsetHeight);
+            jQuery( "#" + rel ).scrollToShow();  
+          }, 250);
+		  jQuery("#" + rel).slideToggle('fast');
+
+		});
+});

plugins/adjustly-collapse/aj-collapse.php

@@ -0,0 +1,37 @@
+<?php
+/*
+Plugin Name: Adjustly Collapse
+Plugin URI: http://www.psdcovers.com/adjustly-collapse
+Description: Allows contributors to create a collapsible element within an article or theme which is triggered by a hyperlink or other element.
+Version: 1.0.0
+Author: PSDCovers.com
+Author URI: http://www.psdcovers.com/
+*/
+
+define('AJ_COLLAPSE_vNum','1.0.0');
+
+// Check for location modifications in wp-config
+// Then define accordingly
+if ( !defined('WP_CONTENT_URL') ) {
+	define('AJ_PLUGPATH',get_option('siteurl').'/wp-content/plugins/'.plugin_basename(dirname(__FILE__)).'/');
+	define('AJ_PLUGDIR', ABSPATH.'/wp-content/plugins/'.plugin_basename(dirname(__FILE__)).'/');
+} else {
+	define('AJ_PLUGPATH',WP_CONTENT_URL.'/plugins/'.plugin_basename(dirname(__FILE__)).'/');
+	define('AJ_PLUGDIR',WP_CONTENT_DIR.'/plugins/'.plugin_basename(dirname(__FILE__)).'/');
+}
+
+// Create Text Domain For Translations
+load_plugin_textdomain('AJ', false, basename(dirname(__FILE__)) . '/languages/');
+
+add_action( 'wp_print_scripts', 'load_aj_collapse' );
+add_action( 'wp_print_styles', 'load_aj_style' );
+
+function load_aj_collapse() {
+ 	wp_enqueue_script('aj-collapse-slider', AJ_PLUGPATH.'aj-collapse.js', array( 'jquery' ));
+}
+
+function load_aj_style() {
+ 	wp_enqueue_style('aj-collapse-style', AJ_PLUGPATH.'aj-collapse.css', false, 'all');
+}
+
+?>

plugins/adjustly-collapse/readme.txt

@@ -0,0 +1,72 @@
+=== Plugin Name ===
+Contributors: Simon Lord & Elran Oded
+Donate link: http://www.psdcovers.com/adjustly-collapse/
+Tags: Collapsible, Slide, Javascript, jQuery, Accordion, Automatic, Condense, Tuck Away, Squish, Reveal
+Requires at least: 3
+Tested up to: 3.3.1
+Stable tag: 1.0.0
+
+Move over, make room: expand and collapse content in an SEO friendly way. Great for contributors or theme designers.
+
+== Description ==
+
+Developed internally for our Adjustly theme, this plugin allows authors to link 2 html elements together as <b>trigger</b> and <b>target</b>.  When the trigger is clicked the target will immediately expand to reveal its content.
+<h4>Try the Demo</h4>
+
+If you're interested in seeing what a default installation of Adjustly Collapse has to offer, have a look at some samples on our site.
+
+<a href="http://www.psdcovers.com/adjustly-collapse/">http://www.psdcovers.com/adjustly-collapse/</a>
+
+
+<h4>Usage</h4>
+
+The basic structure without any CSS bells and whistles looks like this:
+
+<code>
+<a class="aj-collapse" rel="myslidingcontent">trigger</a>
+<div class="aj-hidden" id="myslidingcontent">target: this content is hidden by default</div>
+</code>
+
+In the example above, the <b>trigger</b> is an href element and the <b>target</b> is a div element.  Note that the target can be any element you choose.
+
+<h4>rel="[id]"</h4>
+
+Each trigger and target pair must contain a common label so that the trigger knows which target to expand or collapse. The trigger <b>rel</b> tag must be the same name as the target's <b>id</b> tag.  If you plan on having multiple collapsible elements in a page, post or theme then you will need to ensure that the <b>rel</b> and <b>id</b> tags are always unique for each trigger/target combo.
+<h4>Class Names</h4>
+
+1. The trigger must always have the following class name: <b>class="aj-collapse"</b>
+1. The target can have either of 2 classes: <b>class="aj-hidden"</b> will make the target collapsed by default while <b>class="aj-visible"</b> will display the content normally but allow the viewer to collapse it.
+
+<h4>Notes</h4>
+
+The trigger and target do not have to be next to each other.  The target can be at the opposite end of the article or you can place it within the trigger. Theme developers can use it to make widgets collapsible.
+
+
+== Frequently Asked Questions ==
+
+= Can I use my existing WordPress theme? =
+
+Of course! The plugin is quite useful but isn't dependant on any functionality found in any given version of Wordpress.  But this is our first plugin and therefore has only been tested with the most recent release of WP which is why we can only claim 3.3.1 compatibility.
+
+= Will this affect my SEO? =
+
+No.  The content is clearly visible to search engines and very friendly.
+
+= I am new to Social, do you have a Facebook page? =
+
+Yes we do, but as our brand identity... <a href='https://www.facebook.com/PSDCovers'>PSDCovers</a>. Please like!
+
+= How about Twitter? =
+
+Yes! <a href='https://twitter.com/psdcovers'>@psdcovers</a> does the twitter.  please follow!
+
+= How does one use the shortcode, exactly? =
+
+This plugin does not use shortcodes.
+
+
+== Installation ==
+
+1. Upload `adjustly-collapse` to the `/wp-content/plugins/` directory
+1. Activate the plugin through the 'Plugins' menu in WordPress
+1. Leave a comment at http://www.psdcovers.com/adjustly-collapse/

style.css

@@ -879,19 +879,28 @@ padding-left:10px;
 
 }
 
+
 
 .closebtn{
-	float: right;
-	padding: 3px;
-
+    color: #000;
+	text-align: left;
+padding-right: 10px;
+background: #FFF;
+}
 
-}  
+
+
 
 .aj-hidden{
-       border-top: 2px dashed #000;
+       /*  border-top: 2px dashed #000;
 	border-bottom: 2px dashed #000;
-      /*  border: 5px solid #F8F7ED;
-        background-color: #F8F7ED;*/
+      border: 5px solid #C9E8F5;
+        background-color: #C9E8F5;
+      
+       */
+       border-left: 2px solid #000;
+       padding-left: 15px;
+       width: 120%;
 }
 
   .my-legend .title {
@@ -1050,6 +1059,8 @@ body .gform_wrapper .ginput_complex label,
 	font-size: 12px;
 	letter-spacing: 0.5pt
 }
+
+