cpugeek

I'm trying to create a dropdown menu effect here http://cbd-alpha.com/ideal/But I'm stuck with how to get the menu items under the "about" menu item to stack vertically like a standard dropdown. Here's the CSS: #mainNav { margin: 82px 0 0 160px;}#mainNav ul {list-style-type: none;padding-top: 8px;}#mainNav li { float: left; padding-left: 21px;}#mainNav li:first-child { padding-left: 80px; background: none;}#mainNav a { text-decoration: none; padding: 0px 10px; font: normal 14px "ITCAvantGarde", Helvetica, Arial, sans-serif; color: #FFF;}#mainNav ul ul { display: none;}#mainNav ul ul li { padding-left: 0 !important; z-index: 999 !important;}#mainNav ul ul ul { }#mainNav ul ul a { }#mainNav li:hover > a,#mainNav ul ul :hover > a { color: #afc2d1;}#mainNav ul ul a:hover { }#mainNav ul li:hover > ul { display: block;} And here's the css of a similar menu: #mainNav { margin: 0 auto; position: relative; width: 1000px; z-index: 101; } #mainNav ul { border-left: 1px solid #CCCCCC; border-right: 1px solid #FFFFFF; float: left; height: 37px; list-style: none outside none; margin: 0 auto; padding-left: 0; position: relative; z-index: 100; } #mainNav li { border-left: 1px solid #FFFFFF; border-right: 1px solid #CCCCCC; float: left; position: relative; } #mainNav a { color: #8D8C8C; display: block; font: 18px/38px "GothamBoldRegular",Helvetica,Arial,sans-serif; height: 37px; padding: 0 11px; text-decoration: none; text-transform: uppercase; } #mainNav ul ul { border: medium none; display: none; float: left; left: 0; position: absolute; top: 38px; width: 260px; z-index: 99; } #mainNav ul ul li { background: url("images/nav_bg_hover.png") repeat scroll 0 0 transparent; border: medium none !important; float: none; padding: 0 !important; } #mainNav ul ul ul { left: 100%; top: 0; } #mainNav ul ul a { background-image: none !important; border-bottom: 1px dotted #FFFFFF; color: #FFFFFF; font-weight: normal; height: auto; line-height: normal; overflow: hidden; padding: 10px !important; position: relative; text-transform: capitalize; width: 240px; z-index: 99; } #mainNav li:hover { color: #6A99C8; } #mainNav li:hover { background: url("images/nav_a_hover.jpg") repeat-x scroll center bottom transparent; } #mainNav li:hover li { color: #FFFFFF; } #mainNav ul ul li:hover a { background: url("images/nav_bg_hover.png") repeat scroll 0 0 #56A1D5 !important; } #mainNav ul li:hover > ul { display: block; } How do I stack them vertically?

Hello, it's been a while since I've posted in this forum, but I'm doing what I can to get a pre-existing jQuery plugin to work, and I'm currently pulling out all of my hair. The plugin itself works, I'm just unsure how to implement it. After including it, what html would I use to create the slider? A live version of the script can be viewed here: http://wptitans.com/majestics/ // JavaScript DocumentjQuery(function($){ $.fn.featureslider = function(options){ /* ================================================================================================ *//* ======================================== Plugin Options ======================================== *//* ================================================================================================ */var defaults = { time:4000, width:600, height:400, effect:'none', autoplay:false, listControls:true, callback:function(){ } }; var options = $.extend(defaults, options);/* ================================================================================================ *//* ==================================== Variables & Precaching ==================================== *//* ================================================================================================ */ return this.each(function() { var root = $(this).addClass('mainslider'); var parent = root.parent(); var li = root.find("li"); var images = li.find("img"); var pos,random_no,timer,image_timer,counter,arr,wait,index,block,w,h,src,parent,im,override=false,in_animation = false,controls,canvas,html5_flag=false,imageData,canvas,context,root_parent; var current = li.eq(1).toggleClass('active'),prev = li.first().addClass("reset"); var bool = true,first_bool = true; root.css({ width: options.width, height: options.height }); li.first().find("div.description").css("display","block"); li.first().fadeIn('slow'); current.hide(); if(options.listControls==true) appendControls(); /* ================================================================================================ *//* ======================================== Switcher Module ======================================= *//* ================================================================================================ */ function switcher() { if(current.prev().length>0) prev = current.prev(); else prev = li.last(); prev.removeClass("reset"); current.toggleClass("active reset"); if(current.next().length>0) // setting the next slide current = current.next(); else current = li.first(); current.hide(); current.addClass("active"); options.callback(); } /* ================================================================================================ *//* ================================= Effects Switching & Ending =================================== *//* ================================================================================================ */ function endeffect(image){ if(options.listControls==true) { controls.removeClass("control_active"); controls.eq(current.index()).addClass("control_active"); } clearInterval(timer); setTimeout(function(){ in_animation = false; if(override==false) // Return if manually triggered image_timer = setTimeout(function() { current.find("div.description").fadeOut('fast'); switcher(); effects(); },(options.time-800)); },1000); };function effects(){ if(li.is(":animated"))return; if(bool==true) { li.first().find("div.description").hide(); bool=false; first_bool = false; } switch(0) { case 0: current.find("div.description").fadeIn('normal'); current.fadeIn("slow",function(){ endeffect($(this)); });break; }}/* ================================================================================================ *//* ======================================== Control Options ======================================= *//* ================================================================================================ */ function appendControls() { var str = "<ul class='controls'>"; for(var i=0;i<li.length;i++) str = str + "<li>"+(i+1)+"</li>"; str = str+"</ul>"; root.after(str); controls = parent.find(".controls li"); controls.first().addClass("control_active"); controls.parent().css("left", 980/2 + 20 + controls.parent().width()/2 ) controls.bind({ click:function(){ setImage($(this).index()); }, mouseover:function(){ $(this).toggleClass("control_hover"); }, mouseout:function(){ $(this).toggleClass("control_hover"); } }); }/* ================================================================================================ *//* ======================================== Image Settings ======================================== *//* ================================================================================================ */ function setImage(index){ if(first_bool==true) { if(in_animation==true||current.index()-1==index) return; } else if(in_animation==true||current.index()==index) return; li.removeClass("reset active"); current.find("div.description").hide(); clearTimeout(image_timer); // Manual Override... if(first_bool==true) li.first().addClass("reset"); current.addClass("reset"); prev = current; current = li.eq(index).addClass("active"); override = true; effects(); } if(options.autoplay==true) image_timer = setTimeout(function() { effects(); },options.time); // Starting the Slideshow }); }; });

I'm currently developing an online web community, and I was thinking of allowing the base of the website to be extensible by developers. The site is built on the CodeIgniter and Zend php frameworks. I was wondering what the best way to allow these extensions to be made would be? Would it be better to use the frameworks' plugin capabilities or what? Can someone help point me in the right direction?Any and All help is appreciated! :]

What I'm aiming for is to use links in a gallery, clicking on one of the images will cause the background to change to the selected image.

You think this would work with links? How would I do that? D:

I'm currently trying to make a style changer specifically for my background images. I currently have a working style changer but it requires a style sheet for each background, and I plan to add A LOT of background choices, which would be TOO MANY style sheets. So I'm trying to figure out how to make it more dynamic using a MySql db to store all of the image paths [cookies for the preferred bg path]. I'm not even sure how I would do this, which I know sounds nooby, but all of my approaches don't seem to work.Any and All help is appreciated. [:

I'm been trying to dive into the SoundCloud API using PHP + OAuth, but I'm so confused on where to start.. I have already set up an authentication system and base application using the codeigniter php framework, and I'm curious about how to store the token [i think] so they only have to authorize the site once for SoundCloud. Any and All help is appreciated.

I'm currently trying to add a rearrangeable layout function to my website, and all the examples I'm finding use a cookie which won't matter if logging in on a different device. I have the animations completed, but nothing that remembers the layout. I would think the other best option would be to remember it in a mysql database. Anyone know of a solution or have any ideas?

I don't know how that got set! >< Didn't even notice it, but now it works, thanks!Edit: Just checked and it's not in the source document..

I've been playing around with my css lately and now I've apparently done something to hide the checkbox, using firebug I can't even figure it out. Can someone put in their 2 cents? http://ravecity.tv/auth/login

I finally got it working, it was an issue of how the array was set up, but now it's working fine. I'll post my fix for others later today.

I'm currently trying to create a JSON feed for FullCalendar using CI. I currently have a working example, but the output doesn't get imported into the calendar. Anyone have any ideas? I've been stuck on this for almost 3 days now..In my controller function json() { $data['events'] = $this->events_model->jsonEvents(); header("Content-Type: application/json"); $this->load->view('json', $data); } In my model function jsonEvents (){ $this->db->order_by('startDate', 'desc'); $this->db->limit(10); return $this->db->get('calendar');} } In my view <?php foreach($events->result() as $entry): ?> <?php $jsonevents = array( 'id' => $entry->eventID, 'title' => $entry->eventTitle, 'start' => $entry->startDate, 'allDay' => false, 'end' => $entry->endDate ); echo json_encode($jsonevents); ?> <?php endforeach; ?> The corresponding JSON {"id":"24242","title":"sdfsdfsdfsdf","start":"2011-05-05 13:00:53","allDay":false,"end":"2011-05-06 17:00:19"} {"id":"1234567890","title":"Test","start":"2011-05-05 13:00:53","allDay":false,"end":"2011-05-06 17:00:19"} The calendar setup //Fullcalendar $('#calendar').fullCalendar({ firstDay:'1', weekMode:'liquid', aspectRatio: '1.5', theme:true, selectable:true, editable:true, draggable:true, droppable:true, timeFormat:'H:mm', axisFormat:'H:mm', columnFormat:{ month: 'ddd', // Mon week: 'ddd dS', // Mon 9/7 day: 'dddd dS MMMM' // Monday 9/7 }, titleFormat:{ month: 'MMMM yyyy', // September 2009 week: "MMM d[ yyyy]{ 'to'[ MMM] d, yyyy}", // Sep 7 - 13 2009 day: 'ddd, MMMM d, yyyy' // Tuesday, Sep 8, 2009 }, allDayText:'All Day', header:{ left: 'prev title next, today', center: '', right: 'agendaWeek,agendaDay,month' }, eventSources: [ // your event source { url: 'http://ravecity.tv/feed/json', className:'calendar_magenta' }, { url: 'http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic', className: 'calendar_navy' } ], drop: function(date, allDay) { // this function is called when something is dropped // retrieve the dropped element's stored Event Object var originalEventObject = $(this).data('eventObject'); // we need to copy it, so that multiple events don't have a reference to the same object var copiedEventObject = $.extend({}, originalEventObject); // assign it the date that was reported copiedEventObject.start = date; copiedEventObject.allDay = allDay; // render the event on the calendar // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/) $('#calendar').fullCalendar('renderEvent', copiedEventObject, true); // is the "remove after drop" checkbox checked? if ($('#drop-remove').is(':checked')) { // if so, remove the element from the "Draggable Events" list $(this).remove(); } } }); $('ul#calendar_drag_list li a').each(function() { // create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/) // it doesn't need to have a start or end var eventObject = { title: $.trim($(this).text()), // use the element's text as the event title className: 'calendar_black' }; // store the Event Object in the DOM element so we can get to it later $(this).data('eventObject', eventObject); // make the event draggable using jQuery UI $(this).draggable({ zIndex: 999, revert: true, // will cause the event to go back to its revertDuration: 5 // original position after the drag }); });

I'm currently using the JQuery plugin FullCalendar; which has a feature to pull in events from a google calendar. But I've written a script that dynamically creates RSS from a database, the only snag is it's not formatted like a GCAL feed [https://www.google.com/calendar/feeds/nueoipsjhgm857gpojq5563cfo@group.calendar.google.com/public/basic]. I believe If I can format my feed like a GCAL feed FullCalendar will be able to read it; correct? [if yes, how?] Or would I be better off adding this functionality so I don't have to keep the XML markup the same as google's? FullCalendar reads GCAL feeds using the following code, could it be edited for custom RSS feeds? /* * FullCalendar v1.5 Google Calendar Plugin * * Copyright (c) 2011 Adam Shaw * Dual licensed under the MIT and GPL licenses, located in * MIT-LICENSE.txt and GPL-LICENSE.txt respectively. * * Date: Sat Mar 19 18:59:37 2011 -0700 * */ (function($) {var fc = $.fullCalendar;var formatDate = fc.formatDate;var parseISO8601 = fc.parseISO8601;var addDays = fc.addDays;var applyAll = fc.applyAll;fc.sourceNormalizers.push(function(sourceOptions) { if (sourceOptions.dataType == 'gcal' || sourceOptions.dataType === undefined && (sourceOptions.url || '').match(/^(http|https):\/\/www.google.com\/calendar\/feeds\//)) { sourceOptions.dataType = 'gcal'; if (sourceOptions.editable === undefined) { sourceOptions.editable = false; } }});fc.sourceFetchers.push(function(sourceOptions, start, end) { if (sourceOptions.dataType == 'gcal') { return transformOptions(sourceOptions, start, end); }});function transformOptions(sourceOptions, start, end) { var success = sourceOptions.success; var data = $.extend({}, sourceOptions.data || {}, { 'start-min': formatDate(start, 'u'), 'start-max': formatDate(end, 'u'), 'singleevents': true, 'max-results': 9999 }); var ctz = sourceOptions.currentTimezone; if (ctz) { data.ctz = ctz = ctz.replace(' ', '_'); } return $.extend({}, sourceOptions, { url: sourceOptions.url.replace(/\/basic$/, '/full') + '?alt=json-in-script&callback=?', dataType: 'jsonp', data: data, startParam: false, endParam: false, success: function(data) { var events = []; if (data.feed.entry) { $.each(data.feed.entry, function(i, entry) { var startStr = entry['gd$when'][0]['startTime']; var start = parseISO8601(startStr, true); var end = parseISO8601(entry['gd$when'][0]['endTime'], true); var allDay = startStr.indexOf('T') == -1; var url; $.each(entry.link, function(i, link) { if (link.type == 'text/html') { url = link.href; if (ctz) { url += (url.indexOf('?') == -1 ? '?' : '&') + 'ctz=' + ctz; } } }); if (allDay) { addDays(end, -1); // make inclusive } events.push({ id: entry['gCal$uid']['value'], title: entry['title']['$t'], url: url, start: start, end: end, allDay: allDay, location: entry['gd$where'][0]['valueString'], description: entry['content']['$t'] }); }); } var args = [events].concat(Array.prototype.slice.call(arguments, 1)); var res = applyAll(success, this, args); if ($.isArray(res)) { return res; } return events; } }); }// legacyfc.gcalFeed = function(url, sourceOptions) { return $.extend({}, sourceOptions, { url: url, dataType: 'gcal' });};})(jQuery);

I understand, the poll is for popularity to see which option is more popular [should've chosen better words]. The thread itself is to gain opinions as far as what works better for what. I'm aiming towards building the website into a large site which would handle many users. Popularity is important as far as which one more people would be able [or willing or likely] to use. I'm also inquiring which is easier / more robust / more secure? Does that make more sense?

I'm curious about everyone's opinions on using other login system (e.g. facebook, twitter, google, etc..). First of all if I was to choose JUST ONE to integrate, which would be the "best"? What about OpenID? Would it be better to integrate that, or a social media website's login system? I'm posting this for opinions, opinions, opinions! So please throw in your 2 cents on the issue!